src/ccDarkTheme/vendors/google/_common-interop-components.scss

/*
 * IMPORTANT NOTICE:
 * Note: the following styles have been written by Googlers and thus are not
 * included as part of the MIT license.
 **/

.scSharedCalloutroot {
  color: var(--TWPT-interop-primary-text)!important;
}

.scSharedCallouterror {
  background-color: #523a3b!important;
  border-color: #f9dedc!important;
}

.scSharedCallouterror sc-shared-material-icon {
  color: #f9dedc!important;
}

.scSharedCallouterror>.scSharedCalloutsecondary-button button {
  color: #ec928e!important;
}

.scSharedCalloutcaution {
  background-color: #554c33!important;
  border-color: #ffdf99!important;
}

.scSharedCalloutcaution sc-shared-material-icon {
  color: #ffdf99!important;
}

.scSharedCalloutcaution>.scSharedCalloutsecondary-button button {
  color: #f09d00!important;
}

.scSharedCalloutinformational {
  background-color: #394457!important;
  border-color: #d3e3fd!important;
}

.scSharedCalloutinformational sc-shared-material-icon {
  color: #d3e3fd!important;
}

.scSharedCalloutinformational>.scSharedCalloutsecondary-button button {
  color: var(--TWPT-interop-blue)!important;
}

.scSharedCalloutsuccess {
  background-color: #37493f!important;
  border-color: #c4eed0!important;
}

.scSharedCalloutsuccess sc-shared-material-icon {
  color: #c4eed0!important;
}

.scSharedCalloutsuccess>.scSharedCalloutsecondary-button button {
  color: var(--TWPT-interop-success)!important;
}

.scSharedMaterialbuttonroot {
  --m-btn-text-color: var(--TWPT-interop-blue);
  --m-btn-background-color: transparent;
  --m-btn-outline-color: var(--TWPT-interop-blue);
  background: var(--m-btn-background-color)!important;
  color: var(--m-btn-text-color)!important;
}

.scSharedMaterialbuttonroot:disabled {
  color: rgba(227, 227, 227, 0.369)!important;
}

.scSharedMaterialbuttontext {
  color: var(--TWPT-interop-blue)!important;
}

.scSharedMaterialbuttoncolor-label {
  color: var(--TWPT-interop-secondary-text)!important;
}

.scSharedMaterialbuttoncolor-hint {
  color: var(--TWPT-interop-secondary-text)!important;
}

.scSharedMaterialbuttonnavigational {
  color: var(--TWPT-interop-primary-text)!important;
}

.scSharedMaterialbuttonnavigational-alt {
  color: var(--TWPT-interop-secondary-text)!important;
}

.scSharedMaterialbuttonhairline, .scSharedMaterialbuttonpill {
  outline: 1px solid var(--m-btn-outline-color)!important;
}

.scSharedMaterialbuttonhairline:hover, .scSharedMaterialbuttonhairline:focus, .scSharedMaterialbuttonpill:hover, .scSharedMaterialbuttonpill:focus {
  --m-btn-outline-color: currentColor!important;
}

.scSharedMaterialbuttonhairline {
  --m-btn-outline-color: var(--TWPT-interop-subtle-border)!important;
}

.scSharedMaterialbuttonhairline:disabled {
  --m-btn-outline-color: rgba(227, 227, 227, 0.369)!important;
}

.scSharedMaterialbuttonhairline:active {
  box-shadow: 0 1px 2px 0 rgba(227, 227, 227, 0.302), 0 1px 3px 1px rgba(227, 227, 227, 0.149)!important;
}

.scSharedMaterialbuttontonal {
  color: var(--TWPT-interop-blue)!important;
  background: #394457!important;
  outline: 1px solid #474747!important;
}

.scSharedMaterialbuttontonal:hover {
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.302), 0 1px 3px 1px rgba(0, 0, 0, 0.149)!important;
}

.scSharedMaterialbuttontonal:active {
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.302), 0 2px 6px 2px rgba(0, 0, 0, 0.149)!important;
}

.scSharedMaterialbuttontonal:disabled {
  background: rgba(227, 227, 227, 0.122)!important;
}

.scSharedMaterialbuttonfilled {
  background: var(--TWPT-interop-blue)!important;
  color: #1f1f1f!important;
}

.scSharedMaterialbuttonfilled:disabled {
  background: rgba(227, 227, 227, 0.122)!important;
}

.scSharedMaterialbuttonfilled:hover,
    .scSharedMaterialbuttonfilled:focus {
  box-shadow: 0 1px 2px 0 rgba(124, 172, 248, 0.302), 0 1px 3px 1px rgba(124, 172, 248, 0.149)!important;
}

.scSharedMaterialbuttonfilled:active {
  box-shadow: 0 1px 3px 0 rgba(124, 172, 248, 0.302), 0 4px 8px 3px rgba(124, 172, 248, 0.149)!important;
}

.scSharedMaterialbuttonprotected {
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.302), 0 1px 3px 1px rgba(0, 0, 0, 0.149)!important;
  background: #1f1f1f!important;
  color: var(--TWPT-interop-blue)!important;
}

.scSharedMaterialbuttonprotected:disabled {
  background: rgba(227, 227, 227, 0.122)!important;
}

.scSharedMaterialbuttonprotected:hover {
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.302), 0 1px 3px 1px rgba(0, 0, 0, 0.149)!important;
}

.scSharedMaterialbuttonprotected:focus {
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.302), 0 2px 6px 2px rgba(0, 0, 0, 0.149)!important;
}

.scSharedMaterialbuttonprotected:active {
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.302), 0 4px 8px 3px rgba(0, 0, 0, 0.149)!important;
}

.scSharedMaterialbuttonsuccess {
  --m-btn-text-color: var(--TWPT-interop-success)!important;
  --m-btn-outline-color: var(--TWPT-interop-success)!important;
}

.scSharedMaterialbuttonsuccess.scSharedMaterialbuttonfilled {
  --m-btn-text-color: #1f1f1f!important;
  --m-btn-background-color: var(--TWPT-interop-success)!important;
}

.scSharedMaterialbuttonsuccess.scSharedMaterialbuttontonal {
  --m-btn-background-color: #0f5223
}

@media (forced-colors:active) {
    .scSharedMaterialbuttonroot:focus {
        outline: 2px solid #e3e3e3;
    }
}

@media (prefers-contrast:more) {
    .scSharedMaterialbuttonroot:focus {
        outline: 2px solid #e3e3e3;
    }
}

.scSharedExpandabletextexpander {
  color: var(--TWPT-interop-blue)!important;
}

.scSharedMaterialborderfilled {
  background: #313235!important;
  border-bottom: 1px solid var(--TWPT-interop-secondary-text)!important;
}

.scSharedMaterialborderfilled-error {
  border-bottom-color: #ec928e!important;
}

.scSharedMaterialborderfilled-bottom {
  background-color: var(--TWPT-interop-blue)!important;
}

.scSharedMaterialborderfilled-label {
  color: var(--TWPT-interop-secondary-text)!important;
}

.scSharedMaterialborderfilled-label-focused {
  color: var(--TWPT-interop-blue)!important;
}

.scSharedMaterialborderlabel {
  color: var(--TWPT-interop-secondary-text)!important;
}

.scSharedMaterialborderleft {
  border-bottom-color: var(--TWPT-interop-secondary-text)!important;
  border-left-color: var(--TWPT-interop-secondary-text)!important;
  border-top-color: var(--TWPT-interop-secondary-text)!important;
}

.scSharedMaterialborderleft-error {
  border-bottom-color: #ec928e!important;
  border-left-color: #ec928e!important;
  border-top-color: #ec928e!important;
}

.scSharedMaterialbordermid {
  border-bottom-color: var(--TWPT-interop-secondary-text)!important;
  border-top-color: var(--TWPT-interop-secondary-text)!important;
}

.scSharedMaterialbordermid-error {
  border-bottom-color: #ec928e!important;
  border-top-color: #ec928e!important;
}

.scSharedMaterialborderright {
  border-bottom-color: var(--TWPT-interop-secondary-text)!important;
  border-right-color: var(--TWPT-interop-secondary-text)!important;
  border-top-color: var(--TWPT-interop-secondary-text)!important;
}

.scSharedMaterialborderright-error {
  border-bottom-color: #ec928e!important;
  border-right-color: #ec928e!important;
  border-top-color: #ec928e!important;
}

.scSharedMaterialborderfocused {
  border-color: var(--TWPT-interop-blue)!important;
}

.scSharedMaterialborderdisabled {
  border-color: var(--TWPT-interop-subtle-border)!important;
}

.scSharedMaterialborderlabel-focused {
  color: var(--TWPT-interop-blue)!important;
}

.scSharedMaterialborderlabel-disabled {
  color: rgba(255, 255, 255, 0.239)!important;
}

.scSharedMaterialborderlabel-error {
  color: #ec928e!important;
}

.scSharedMaterialcardroot {
  background: #1f1f1f;
  border: 1px solid var(--TWPT-interop-subtle-border);
}

.scSharedMaterialcardelevation-1 {
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.302), 0 1px 3px 1px rgba(0, 0, 0, 0.149)!important;
  background: #2a2b2f!important;
}

.scSharedMaterialcardelevation-2 {
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.302), 0 2px 6px 2px rgba(0, 0, 0, 0.149)!important;
  background: #303135!important;
}

.scSharedMaterialcardelevation-3 {
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.302), 0 4px 8px 3px rgba(0, 0, 0, 0.149)!important;
  background: #36383a!important;
}

.scSharedMaterialcardelevation-4 {
  box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.302), 0 6px 10px 4px rgba(0, 0, 0, 0.149)!important;
  background: #39393c!important;
}

.scSharedMaterialcardelevation-5 {
  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.302), 0 8px 12px 6px rgba(0, 0, 0, 0.149)!important;
  background: #3c3e40!important;
}

@media (forced-colors:active) {
  .scsharedmaterialcardroot {
    border-color: #e3e3e3;
  }
}

@media (prefers-contrast:more) {
  .scsharedmaterialcardroot {
    border-color: #e3e3e3;
  }
}

.scSharedMaterialcheckboxcheckbox {
  color: var(--TWPT-interop-blue)!important;
}

.scSharedMaterialcheckboxbox {
  border-color: var(--TWPT-interop-secondary-text)!important;
}

.scSharedMaterialcheckboxnative-control:checked:disabled+.scSharedMaterialcheckboxbox,
.scSharedMaterialcheckboxnative-control:indeterminate:disabled+.scSharedMaterialcheckboxbox {
  background: rgba(0, 0, 0, .26);
  border-color: transparent;
}

.scSharedMaterialcheckboxnative-control:disabled+.scSharedMaterialcheckboxbox {
  border-color: rgba(0, 0, 0, .26);
}

.scSharedMaterialcheckboxcheckmark-path {
  stroke: #1f1f1f!important;
}

.scSharedMaterialcheckboxmixedmark {
  border-color: #1f1f1f!important;
}

.scSharedMaterialfabroot {
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.302), 0 4px 8px 3px rgba(0, 0, 0, 0.149);
  background: #303135;
  color: var(--TWPT-interop-blue);
}

@media (forced-colors:active) {
  .scSharedMaterialfabroot {
    outline: 3px solid var(--TWPT-interop-blue);
  }
}

.scSharedMaterialfabroot.scSharedMaterialfabgrey {
  color: var(--TWPT-interop-secondary-text);
}

.scSharedMaterialfabroot:hover,
.scSharedMaterialfabroot:focus {
  box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.302), 0 6px 10px 4px rgba(0, 0, 0, 0.149);
}

.scSharedMaterialfabroot:active {
  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.302), 0 8px 12px 6px rgba(0, 0, 0, 0.149);
}

.scSharedMaterialfablowered {
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.302), 0 1px 3px 1px rgba(0, 0, 0, 0.149);
}

.scSharedMaterialfablowered.scSharedMaterialfabfake-focus,
.scSharedMaterialfablowered:hover,
.scSharedMaterialfablowered:focus {
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.302), 0 2px 6px 2px rgba(0, 0, 0, 0.149);
}

.scSharedMaterialfablowered:active {
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.302), 0 4px 8px 3px rgba(0, 0, 0, 0.149);
}

.scSharedMaterialfabfilled {
  background: rgba(124,172,248,0.239);
  color: var(--TWPT-interop-blue);
}

.scSharedMaterialfabfilled.scSharedMaterialfabgrey {
  background: var(--TWPT-interop-secondary-text);
  color: #1f1f1f;
}

.scSharedMaterial_dialogDialogcontentloading-overlay {
  background: rgba(227, 227, 227, 0.122)!important;
}

.scSharedMaterialpopupbackground {
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.302), 0 1px 3px 1px rgba(0, 0, 0, 0.149)!important;
  background: #2a2b2f!important;
  border: 1px solid var(--TWPT-interop-subtle-border)!important;
}

@media (forced-colors:active) {
  .scSharedMaterialpopupbackground {
    border-color: #e3e3e3;
  }
}

@media (prefers-contrast:more) {
  .scSharedMaterialpopupbackground {
    border-color: #e3e3e3;
  }
}

.scSharedMaterialmenuroot {
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.302), 0 1px 3px 1px rgba(0, 0, 0, 0.149)!important;
  background: #2a2b2f!important;
}

.scSharedMaterialmenuitem {
  color: var(--TWPT-interop-primary-text)!important;
}

.scSharedMaterialmenuitem[disabled] {
  color: var(--TWPT-interop-subtle-border);
}

.scSharedMaterialmenuitem-separator {
  border-top-color: var(--TWPT-interop-subtle-border)!important;
}

.scSharedMaterialmenuhighlight:focus,
    .scSharedMaterialmenuhighlight:hover {
  background-color: #394457!important;
}

.scSharedMaterialmenuhighlight:focus {
  outline: auto var(--TWPT-interop-blue) 1px!important;
}

.scSharedMaterialtooltipcontainer {
  background-color: #e3e3e3;
  color: #1f1f1f;
}

.scSharedMaterialradioradio {
  color: var(--TWPT-interop-blue);
}

.scSharedMaterialradioring {
  border: 2px solid var(--TWPT-interop-secondary-text);
}

.scSharedMaterialradionative-control:disabled~.scSharedMaterialradioring {
  border-color: rgba(0, 0, 0, .26);
}

.scSharedMaterialradiodot {
  border-color: var(--TWPT-interop-blue);
}

.scSharedMaterialradionative-control:disabled~.scSharedMaterialradiodot {
  background: rgba(0, 0, 0, .26);
}

.scSharedMaterialrichtooltipcontainer {
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.302), 0 1px 3px 1px rgba(0, 0, 0, 0.149);
}

.scSharedMaterialrichtooltiproot.scSharedMaterialrichtooltipstyle-normal .scSharedMaterialrichtooltipcontainer {
  background: #2a2b2f;
}

.scSharedMaterialrichtooltiproot.scSharedMaterialrichtooltipstyle-accented .scSharedMaterialrichtooltipcontainer {
  background: var(--TWPT-interop-blue);
  color: #1f1f1f;
}

.scSharedMaterialrichtooltipcaret {
  box-shadow: 1.5px 1.5px 1px -1px rgba(0, 0, 0, 0.2), .75px .75px 1px 0 rgba(0, 0, 0, 0.141), .75px .75px 3px 0 rgba(0, 0, 0, 0.122);
  background: #2a2b2f;
}

.scSharedMaterialrichtooltiproot.scSharedMaterialrichtooltipstyle-normal .scSharedMaterialrichtooltipcaret {
  background: #2a2b2f;
}

.scSharedMaterialrichtooltiproot.scSharedMaterialrichtooltipstyle-accented .scSharedMaterialrichtooltipcaret {
  background: var(--TWPT-interop-blue);
}

.scSharedMaterialselectlabel {
  color: #e3e3e3;
}

.scSharedMaterialselectarrow {
  color: var(--TWPT-interop-secondary-text);
}

.scSharedMaterialselectactive .scSharedMaterialselectarrow {
  color: var(--TWPT-interop-blue);
}

.scSharedMaterialselectdisabled .scSharedMaterialselectselection,
.scSharedMaterialselectdisabled .scSharedMaterialselectarrow {
  color: rgba(255, 255, 255, 0.239);
}

.scSharedMaterialsnackbarsnackbar {
  background: var(--TWPT-interop-primary-text)!important;
  color: #1f1f1f!important;
}

.scSharedMaterialsnackbaraction button {
  color: #0b57d0!important;
}

.scSharedMaterialtabbartab {
  color: var(--TWPT-interop-primary-text)!important;
}

.scSharedMaterialtabbartab:hover,
    .scSharedMaterialtabbartab:focus {
  background-color: #313235!important;
}

.scSharedMaterialtabbarselected {
  border-bottom-color: var(--TWPT-interop-blue)!important;
  color: var(--TWPT-interop-blue)!important;
}

.scSharedMaterialtextfieldlabel {
  color: var(--TWPT-interop-primary-text)!important;
}

.scSharedMaterialtextfieldnative-control {
  caret-color: var(--TWPT-interop-blue)!important;
  color: var(--TWPT-interop-primary-text)!important;
}

.scSharedMaterialtextfieldinvalid .scSharedMaterialtextfieldnative-control {
  caret-color: #ec928e!important;
}

.scSharedMaterialtextfieldnative-control:disabled {
  color: var(--TWPT-interop-secondary-text)!important;
}

.scSharedMaterialtextfieldfocused .scSharedMaterialtextfieldlabel {
  color: var(--TWPT-interop-blue)!important;
}

.scSharedMaterialtextfieldinvalid .scSharedMaterialtextfieldlabel {
  color: #ec928e!important;
}

.scSharedMaterialtextfielddisabled .scSharedMaterialtextfieldlabel {
  color: var(--TWPT-interop-secondary-text)!important;
}

.scSharedMaterialtextfieldhelper-text {
  color: var(--TWPT-interop-secondary-text)!important;
}

.scSharedMaterialtextfieldhelper-text-invalid {
  color: #ec928e!important;
}

.scSharedMaterialtextfieldhelper-text-disabled {
  color: var(--TWPT-interop-secondary-text)!important;
}

.scTailwindSharedActivitychartroot {
  border: 1px solid var(--TWPT-interop-subtle-border)!important;
}

.scTailwindSharedAvatarroot {
  background-color: #f1f3f4;
  border: .375rem solid #f1f3f4;
}

.scTailwindSharedAvatarroot.scTailwindSharedAvatarmedium.scTailwindSharedAvatarat-least-silver,
.scTailwindSharedAvatarroot.scTailwindSharedAvatarsmall.scTailwindSharedAvatarat-least-silver {
  border: .125rem solid #f1f3f4;
}

.scTailwindSharedAvatarsilhouette {
  background-color: #fff;
}

.scTailwindSharedAvataravatar-loading {
  background: #1f1f1f!important;
}

.scTailwindSharedAvataruploadedit-button {
  background-color: rgba(0, 0, 0, 0.4);
  color: #fff;
}

.scTailwindSharedAvataruploadroot:focus .scTailwindSharedAvataruploadedit-button,
.scTailwindSharedAvataruploadroot:focus-within .scTailwindSharedAvataruploadedit-button,
.scTailwindSharedAvataruploadroot:hover .scTailwindSharedAvataruploadedit-button {
  background-color: rgba(0, 0, 0, 0.54);
}

.scTailwindSharedDisplay_name_editorDisplaynameeditorlabel {
  color: var(--TWPT-interop-secondary-text);
}

.scTailwindSharedPiidialogfinding {
  color: var(--TWPT-interop-secondary-text);
}

.scTailwindSharedReportabusedialogcontent .abuse-link {
  color: var(--TWPT-interop-blue)!important;
}

.scTailwindSharedRich_text_editorAttachmentFailedoverlayroot {
  background: rgba(0, 0, 0, 0.902);
  color: #ec928e;
}

.scTailwindSharedRich_text_editorAttachmentLoadingoverlayroot {
  background: rgba(227, 227, 227, 0.369);
}

.scTailwindSharedRich_text_editorAttachmentRemovebuttonremove-button {
  background: #1f1f1f;
  border: 1px solid #27282b;
  color: var(--TWPT-interop-secondary-text);
}

.scTailwindSharedRich_text_editorAttachmentRemovebuttonremove-button:hover,
.scTailwindSharedRich_text_editorAttachmentRemovebuttonremove-button:focus {
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.302), 0 1px 3px 1px rgba(0, 0, 0, 0.149);
}

.scTailwindSharedRich_text_editorAttachmentNoninlinedattachmentroot {
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.302), 0 1px 3px 1px rgba(0, 0, 0, 0.149);
  background: #36373a;
}

.scTailwindSharedRich_text_editorAttachmentNoninlinedattachmentfilename {
  color: #e3e3e3;
}

.scTailwindSharedRich_text_editorAttachmentNoninlinedattachmentextension {
  color: var(--TWPT-interop-secondary-text);
}

.scTailwindSharedRich_text_editorLinktooltiproot button {
  color: var(--TWPT-interop-blue);
}

.scTailwindSharedRichtexteditoreditor {
  background: #1f1f1f;
  color: #e3e3e3;
}

.scTailwindSharedRichtexteditorplaceholder {
  color: var(--TWPT-interop-secondary-text);
}

.scTailwindSharedRichtexteditorhas-bottom-panel {
  border-bottom: 1px solid var(--TWPT-interop-subtle-border);
}

.scTailwindSharedRichtexteditorhint {
  color: var(--TWPT-interop-secondary-text);
}

.scTailwindSharedRich_text_editorToolbarcontrolroot {
  color: var(--TWPT-interop-secondary-text);
}

.scTailwindSharedRich_text_editorToolbarcontrolroot:hover {
  color: #e3e3e3;
}

.scTailwindSharedRich_text_editorToolbarcontrolroot:focus {
  border: .125rem solid var(--TWPT-interop-blue);
}

.scTailwindSharedRich_text_editorToolbarcontrolactive {
  background: rgba(227, 227, 227, 0.122);
}

.scTailwindSharedRich_text_editorToolbarMobiletoolbarattachment,
.scTailwindSharedRich_text_editorToolbarMobiletoolbartext-format {
  border-right: 1px solid var(--TWPT-interop-subtle-border);
}

.scTailwindSharedRich_text_editorToolbarMobiletoolbartext-format-button {
  color: var(--TWPT-interop-secondary-text);
}

.scTailwindSharedRich_text_editorToolbarMobiletoolbargroup {
  border-right: 1px solid var(--TWPT-interop-subtle-border);
}

.scTailwindSharedRich_text_editorToolbargroup:not(:first-child) {
  border-left: 1px solid var(--TWPT-interop-subtle-border);
}

.scTailwindSharedTitlefieldhelper-text {
  color: var(--TWPT-interop-secondary-text);
}

.sc-select {
  border: .0625rem solid var(--TWPT-interop-secondary-text);
  color: #e3e3e3;
}

.sc-select.keyboard-focus {
  border-color: transparent;
  box-shadow: 0 0 0 .125rem #a8c7fa;
}

.sc-select svg {
  fill: var(--TWPT-interop-secondary-text);
}

.sc-select ol {
  background: #272727;
  box-shadow: 0 .1875rem .3125rem -.0625rem rgba(0, 0, 0, 0.4), 0 .375rem .625rem 0 rgba(0, 0, 0, 0.28), 0 .0625rem 1.125rem 0 rgba(0, 0, 0, 0.24);
}

.sc-select .sc-select-highlight {
  background-color: #5ab3f0;
  color: #1f1f1f;
}

.scRecommended_resourcesVideo_carouselVideocardroot {
  background: #1f1f1f!important;
  border: 1px solid var(--TWPT-interop-subtle-border)!important;
}

// The Community Console doesn't support the dark theme, so we need to style the
// light components as if they were dark.
.scRecommended_resourcesVideo_carouselVideocardlight:hover,.scRecommended_resourcesVideo_carouselVideocardlight:focus, .scRecommended_resourcesVideo_carouselVideocarddark:hover,.scRecommended_resourcesVideo_carouselVideocarddark:focus {
  background: linear-gradient(0deg,rgba(168,199,250,.05),rgba(168,199,250,.05)),linear-gradient(0deg,rgba(199,199,199,.02),rgba(199,199,199,.02)),linear-gradient(0deg,#1f1f1f,#1f1f1f)!important;
  border-color: transparent!important;
}

.scRecommended_resourcesVideo_carouselVideocardlight:focus, .scRecommended_resourcesVideo_carouselVideocarddark:focus {
  outline: .125rem #fff solid!important;
}

.scRecommended_resourcesVideo_carouselVideocardtitle {
  color: #e3e3e3!important;
}

.scRecommended_resourcesVideo_carouselVideocardicon {
  filter: drop-shadow(0 0 24px rgba(0,0,0,.35))!important;
}

.scRecommended_resourcesVideo_carouselVideocardicon svg {
  fill: #fff!important;
}

.scRecommended_resourcesVideo_carouselVideocardduration {
  background-color: var(--TWPT-interop-secondary-text)!important;
  color: #1f1f1f!important;
}