@supports (font: -apple-system-body) {
    html {
        font: -apple-system-body !important;
    }
}

:root {
    --md-button-primary-bg-color: #000000f2;
    --md-button-primary-hover-bg-color: #000000cc;
    --md-button-primary-pressed-bg-color: #000000B2;
    --md-button-primary-text-color: #fffffff2;
    --md-button-primary-outline-color: #1170CF;
    --md-button-primary-outline-text-color: #1170CF;
    --md-button-secondary-bg-color: #DEDEDE;
    --md-button-secondary-hover-bg-color: #CCCCCC;
    --md-button-secondary-pressed-bg-color: #B2B2B2;
    --md-button-secondary-text-color: #121212;
    --md-button-secondary-outline-color: #545454;
    --md-button-secondary-outline-text-color: #545454;
    --md-button-join-bg-color: #00853C;
    --md-button-join-hover-bg-color: #03612C;
    --md-button-join-pressed-bg-color: #08421F;
    --md-button-join-text-color: #F7F7F7;
    --md-button-join-outline-color: #03612C;
    --md-button-join-outline-text-color: #03612C;
    --md-button-cancel-bg-color: #D4371C;
    --md-button-cancel-hover-bg-color: #A12512;
    --md-button-cancel-pressed-bg-color: #6E1D13;
    --md-button-cancel-text-color: #F7F7F7;
    --md-button-cancel-outline-color: #A12512;
    --md-button-cancel-outline-text-color: #A12512;
    --md-button-ghost-bg-color: none;
    --md-button-ghost-hover-bg-color: #545454;
    --md-button-ghost-pressed-bg-color: #3B3B3B;
    --md-button-ghost-text-color: #121212;
    --md-button-focus-ring-color: #007AA3;
    --md-button-disabled-bg-color: #00000033;
    --md-button-disabled-text-color: #00000066;
    --md-input-background-color: #FFFFFF;
    --md-input-background-hover: #0000001C;
    --md-input-background-pressed: #CCCCCC;
    --md-input-background-active: #DEDEDE;
    --md-input-background-theme-color: #007AA3;
    --md-input-background-theme-hover: #005E7D;
    --md-input-background-theme-pressed: #064157;
    --md-input-background-theme-active: #064157;
    --md-input-background-theme-disabled: #EBFCFF;
    --md-input-background-error: #FFF5F2;
    --md-input-disabled: #EDEDED;
    --md-input-focusRing: #007AA3;
    --md-input-outline-color: #00000080;
    --md-input-outline-active: #000000E5;
    --md-input-outline-error: #AB0A15;
    --md-input-text-primary: #121212;
    --md-input-text-secondary: #545454;
    --md-input-text-disabled: #B2B2B2;
    --md-input-text-error: #AB0A15;
    --md-input-text-success: #185E46;
    --md-textColor-primary: #121212;
    --md-textColor-secondary: #545454;
    --md-textColor-disabled: #B2B2B2;
    --md-textColor-highlight: #DEDEDE;
    --md-textColor-hyperlink-color: #0353A8;
    --md-textColor-hyperlink-hover: #0A274A;
    --md-textColor-hyperlink-focus: #0353A8;
    --md-background-primary: #FFFFFF;
    --md-background-secondary: #F7F7F7;
    --md-background-tertiary: #EDEDED;
    --md-background-quaternary: #DEDEDE;
    --md-presence-busy: #FC9D03;
    --md-presence-doNotDisturb: #D4371C;
    --md-presence-active: #00AB50;
    --md-presence-away: #CCCCCC;
    --md-alert-background-warning: #FFECC2;
    --md-alert-background-error: #FFFFFF;
    --md-alert-background-error-hover: #0000001C;
    --md-alert-background-theme: #C9F4FF;
    --md-alert-background-success: #BEFADE;
    --md-alert-text-warning: #7D4705;
    --md-alert-text-error: #A12512;
    --md-alert-text-theme: #005E7D;
    --md-alert-text-success: #03612C;
    --md-avatar-cobalt: #99DDFF;
    --md-avatar-cyan: #67E7F0;
    --md-avatar-gold: #EBD460;
    --md-avatar-gray: #CCCCCC;
    --md-avatar-lime: #BCE36F;
    --md-avatar-mint: #74E8D1;
    --md-avatar-orange: #FFCA99;
    --md-avatar-pink: #FFC7D2;
    --md-avatar-purple: #FAC3F8;
    --md-avatar-slate: #CED2ED;
    --md-avatar-violet: #E2CAFC;
    --md-separator-primary: #CCCCCC;
    --md-separator-secondary: #B2B2B2;
    --label-text-color: #000000F2;
    --md-input-focus-shadow:  0px 0px 0px 2px #FFFFFF, 0px 0px 0px 4px #1170CF, 0px 0px 0px 5px #1170CF4D;
    --md-button-focus-shadow: 0px 0px 0px 2px #FFFFFF, 0px 0px 0px 4px #1170CF, 0px 0px 0px 5px #1170CF4D;

    /* broker custom properties*/
    /* inline background image from url('../images/webex-background-light.svg')*/
    --body-background-image: url("data:image/svg+xml,%3Csvg width='1440' height='1027' viewBox='0 0 1440 1027' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1574.69 0H-136V1027H1574.69V0Z' fill='white'/%3E%3Cpath d='M1574.69 0H-136V1027H1574.69V0Z' fill='%23F8F8F8'/%3E%3Cpath d='M1575 84.6126V1026.96H227.521C247.038 475.386 700.084 34.2324 1256.11 34.2324C1367.42 34.2324 1474.6 51.9054 1575 84.6126Z' fill='url(%23paint0_linear)'/%3E%3Cpath d='M1574.69 0H-136V1027H1574.69V0Z' fill='url(%23paint1_radial)'/%3E%3Cpath d='M1574.69 0H-136V1027H1574.69V0Z' fill='url(%23paint2_radial)'/%3E%3Cpath d='M1574.69 0H-136V1027H1574.69V0Z' fill='url(%23paint3_radial)'/%3E%3Cpath d='M1574.69 0H-136V1027H1574.69V0Z' fill='url(%23paint4_linear)'/%3E%3Cpath d='M1575 84.6126V1026.96H227.521C247.038 475.386 700.084 34.2324 1256.11 34.2324C1367.42 34.2324 1474.6 51.9054 1575 84.6126Z' fill='url(%23paint5_linear)'/%3E%3Cpath d='M1574.26 379.42V1026.82H936.03C1208.9 881.067 1432.24 654.656 1574.26 379.42Z' fill='url(%23paint6_linear)'/%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear' x1='534.732' y1='236.78' x2='1027.5' y2='1134.25' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23E9E9E9'/%3E%3Cstop offset='1' stop-color='%23E9E9E9' stop-opacity='0'/%3E%3C/linearGradient%3E%3CradialGradient id='paint1_radial' cx='0' cy='0' r='1' gradientUnits='userSpaceOnUse' gradientTransform='translate(1107.81 98.4208) rotate(117.279) scale(326.592 1174.43)'%3E%3Cstop stop-color='%23F8F8F8'/%3E%3Cstop offset='1' stop-color='%23F8F8F8' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='paint2_radial' cx='0' cy='0' r='1' gradientUnits='userSpaceOnUse' gradientTransform='translate(1149.87 92.0021) rotate(135.704) scale(441.172 1587)'%3E%3Cstop stop-color='%23F8F8F8'/%3E%3Cstop offset='1' stop-color='%23F8F8F8' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='paint3_radial' cx='0' cy='0' r='1' gradientUnits='userSpaceOnUse' gradientTransform='translate(1356.57 67.0403) rotate(179.313) scale(297.253 201.596)'%3E%3Cstop stop-color='%23F8F8F8'/%3E%3Cstop offset='1' stop-color='%23F8F8F8' stop-opacity='0'/%3E%3C/radialGradient%3E%3ClinearGradient id='paint4_linear' x1='834.102' y1='1074.78' x2='834.102' y2='300.255' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23F8F8F8'/%3E%3Cstop offset='1' stop-color='%23F8F8F8' stop-opacity='0'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint5_linear' x1='300.938' y1='-32.0947' x2='694.227' y2='377.353' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23E9E9E9'/%3E%3Cstop offset='1' stop-color='%23E9E9E9' stop-opacity='0'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint6_linear' x1='1444.25' y1='632.604' x2='1021.21' y2='1315.63' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23ECECEC'/%3E%3Cstop offset='1' stop-color='%23F7F7F7' stop-opacity='0'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E%0A");
    --body-background-fallback-color: #E9E9E9;
    --body-background-image-ie: url('/idb/images/webex-background-light.svg');
    --footer-url: url("/idb/images/webex-footer-black.svg");

    --apple-icon-image-url: url("/idb/images/apple-logo-black.svg");
}

[data-theme="dark"] {
    --md-button-primary-bg-color: #FFFFFFF2;
    --md-button-primary-hover-bg-color: #FFFFFFCC;
    --md-button-primary-pressed-bg-color: #FFFFFFB2;
    --md-button-primary-text-color: #000000F2;
    --md-button-primary-outline-color: #07C1F5;
    --md-button-primary-outline-text-color: #07C1F5;
    --md-button-secondary-bg-color: #707070;
    --md-button-secondary-hover-bg-color: #545454;
    --md-button-secondary-pressed-bg-color: #3B3B3B;
    --md-button-secondary-text-color: #F7F7F7;
    --md-button-secondary-outline-color: #B2B2B2;
    --md-button-secondary-outline-text-color: #B2B2B2;
    --md-button-join-bg-color: #00853C;
    --md-button-join-hover-bg-color: #03612C;
    --md-button-join-pressed-bg-color: #08421F;
    --md-button-join-text-color: #F7F7F7;
    --md-button-join-outline-color: #00CF64;
    --md-button-join-outline-text-color: #00CF64;
    --md-button-cancel-bg-color: #D4371C;
    --md-button-cancel-hover-bg-color: #A12512;
    --md-button-cancel-pressed-bg-color: #6E1D13;
    --md-button-cancel-text-color: #F7F7F7;
    --md-button-cancel-outline-color: #FF9580;
    --md-button-cancel-outline-text-color: #FF9580;
    --md-button-ghost-bg-color: none;
    --md-button-ghost-hover-bg-color: #545454;
    --md-button-ghost-pressed-bg-color: #707070;
    --md-button-ghost-text-color: #F7F7F7;
    --md-button-focus-ring-color: #07C1F5;
    --md-button-disabled-bg-color: #FFFFFF33;
    --md-button-disabled-text-color: #FFFFFF66;
    --md-input-background-color: #121212;
    --md-input-background-hover: #FFFFFF1C;
    --md-input-background-pressed: #545454;
    --md-input-background-active: #3B3B3B;
    --md-input-background-theme-color: #07C1F5;
    --md-input-background-theme-hover: #00A0D1;
    --md-input-background-theme-pressed: #007AA3;
    --md-input-background-theme-active: #007AA3;
    --md-input-background-theme-disabled: #092D3B;
    --md-input-background-error: #4A1812;
    --md-input-disabled: #292929;
    --md-input-focusRing: #07C1F5;
    --md-input-outline-color: #FFFFFF80;
    --md-input-outline-active: #FFFFFFE5;
    --md-input-outline-error: #FC8B98;
    --md-input-text-primary: #F7F7F7;
    --md-input-text-secondary: #545454;
    --md-input-text-disabled: #B2B2B2;
    --md-input-text-error: #FC8B98;
    --md-input-text-success: #3CC29A;
    --md-textColor-primary: #F7F7F7;
    --md-textColor-secondary: #B2B2B2;
    --md-textColor-disabled: #545454;
    --md-textColor-highlight: #3B3B3B;
    --md-textColor-hyperlink-color: #64B4FA;
    --md-textColor-hyperlink-hover: #BFE3FF;
    --md-textColor-hyperlink-focus: #64B4FA;
    --md-background-primary: #121212;
    --md-background-secondary: #1C1C1C;
    --md-background-tertiary: #292929;
    --md-background-quaternary: #3B3B3B;
    --md-presence-busy: #FC9D03;
    --md-presence-doNotDisturb: #D4371C;
    --md-presence-active: #00AB50;
    --md-presence-away: #CCCCCC;
    --md-alert-background-warning: #54330D;
    --md-alert-background-error: #000000;
    --md-alert-background-error-hover: #FFFFFF1C;
    --md-alert-background-theme: #064157;
    --md-alert-background-success: #08421F;
    --md-alert-text-warning: #FC9D03;
    --md-alert-text-error: #FF9580;
    --md-alert-text-theme: #07C1F5;
    --md-alert-text-success: #00CF64;
    --md-avatar-cobalt: #99DDFF;
    --md-avatar-cyan: #67E7F0;
    --md-avatar-gold: #EBD460;
    --md-avatar-gray: #CCCCCC;
    --md-avatar-lime: #BCE36F;
    --md-avatar-mint: #74E8D1;
    --md-avatar-orange: #FFCA99;
    --md-avatar-pink: #FFC7D2;
    --md-avatar-purple: #FAC3F8;
    --md-avatar-slate: #CED2ED;
    --md-avatar-violet: #E2CAFC;
    --md-separator-primary: #545454;
    --md-separator-secondary: #707070;
    --label-text-color: #FFFFFFF2;
    --md-input-focus-shadow:  0px 0px 0px 2px #000000,  0px 0px 0px 4px #64B4FA, 0px 0px 0px 5px #64B4FA4D;
    --md-button-focus-shadow: 0px 0px 0px 2px #000000F2, 0px 0px 0px 4px #64B4FA, 0px 0px 0px 5px #64B4FA59;

    /* broker custom properties*/
    /* inline background image from url('../images/webex-background-dark.svg')*/
    --body-background-image: url("data:image/svg+xml,%3Csvg width='1440' height='1027' viewBox='0 0 1440 1027' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1575 0H-136V1027H1575V0Z' fill='white'/%3E%3Cpath d='M1575 0H-136V1027H1575V0Z' fill='url(%23paint0_linear)'/%3E%3Cpath d='M1575 0H-136V1027H1575V0Z' fill='url(%23paint1_radial)'/%3E%3Cpath d='M1575 86.2481V1027H251.826C253.366 484.76 713.722 45.6445 1281.37 45.6445C1383.4 45.6445 1481.95 59.8335 1575 86.2481Z' fill='url(%23paint2_linear)'/%3E%3Cpath d='M1575 86.2481V1027H251.826C253.366 484.76 713.722 45.6445 1281.37 45.6445C1383.4 45.6445 1481.95 59.8335 1575 86.2481Z' fill='url(%23paint3_linear)'/%3E%3Cpath d='M1575 0H-136V1027H1575V0Z' fill='url(%23paint4_radial)'/%3E%3Cpath d='M1575 0H-136V1027H1575V0Z' fill='url(%23paint5_linear)'/%3E%3Cpath d='M1575 86.2481V1027H251.826C253.366 484.76 713.722 45.6445 1281.37 45.6445C1383.4 45.6445 1481.95 59.8335 1575 86.2481Z' fill='url(%23paint6_linear)'/%3E%3Cpath d='M1574.57 379.42V1026.82H936.227C1209.15 881.067 1432.53 654.656 1574.57 379.42Z' fill='url(%23paint7_linear)'/%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear' x1='-111.76' y1='1027' x2='-111.76' y2='18.5435' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%2320201F'/%3E%3Cstop offset='1' stop-color='%231C1B1A'/%3E%3C/linearGradient%3E%3CradialGradient id='paint1_radial' cx='0' cy='0' r='1' gradientUnits='userSpaceOnUse' gradientTransform='translate(998.963 1027) rotate(1.38147) scale(857.888 929.915)'%3E%3Cstop stop-color='%23242221'/%3E%3Cstop offset='0.951242' stop-color='%23514946' stop-opacity='0'/%3E%3C/radialGradient%3E%3ClinearGradient id='paint2_linear' x1='370.18' y1='984.748' x2='1506.97' y2='62.697' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%230F0F0F'/%3E%3Cstop offset='0.432661' stop-color='%23141313'/%3E%3Cstop offset='1' stop-color='%230F0F0F'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint3_linear' x1='748.059' y1='803.469' x2='1718.2' y2='355.59' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%230F0F0F' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%23131313'/%3E%3C/linearGradient%3E%3CradialGradient id='paint4_radial' cx='0' cy='0' r='1' gradientUnits='userSpaceOnUse' gradientTransform='translate(1158.66 73.459) rotate(116.729) scale(740.229 882.385)'%3E%3Cstop stop-color='%231F1D1C'/%3E%3Cstop offset='0.951242' stop-color='%231E1D1C' stop-opacity='0'/%3E%3C/radialGradient%3E%3ClinearGradient id='paint5_linear' x1='1273.44' y1='344.473' x2='890.499' y2='618.198' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23191717'/%3E%3Cstop offset='0.951242' stop-color='%23121212' stop-opacity='0'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint6_linear' x1='610.455' y1='686.933' x2='201.444' y2='454.726' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23101010' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%231B1B1B'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint7_linear' x1='1549.33' y1='557.005' x2='1170.62' y2='957.673' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%230F0F0F'/%3E%3Cstop offset='1' stop-color='%230F0F0F'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E%0A");
    --body-background-fallback-color: #1C1B1A;
    --body-background-image-ie: url('/idb/images/webex-background-dark.svg');
    --footer-url: url('/idb/images/webex-footer-white.svg');

    --apple-icon-image-url: url("/idb/images/apple-logo.svg");
}