/*
    Official Hesk Midnight Ocean (dark theme)

    Create your own theme by adjusting the main theme variables.
    TIPS:
        1) Midnight Ocean is the perfect starting base for creating any "dark" theme, as it requires no additional CSS adjustments, besides just changing colors.
            I.e. Things like inverted icon colors, or lighter texts etc.
        2) Instead of adjusting the existing theme files, please simply create a copy of this file, and renamed it to your new theme.
            The theme will then automatically become available under Admin -> Settings -> General -> Customer Theme
        3) Any theme can also have values overwritten in Admin Settings -> Look & Feel,
        so if what you need is just some changes that are support by the existing theme colors, we suggest using that.

        4) USAGE:
        - By adjusting --primary, --secondary and --tertiary, most of other colors will be adjusted
          programmatically based on these.
        - Programmatic adjustments require support of the css function color-mix().
          This is currently supported for roughly 93% browser users (growing yearly).
          For the rest, there are fallbacks, but they might "not look as good", but keep things functional.
        - For the active theme, a "theme_{theme_file_name}" class will be added to the HTML element.
          This means you can easily override styling of any elements, by overriding the default CSS selector with a stronger specifier.
          For example, say you wanted to override styling of the ".btn-full" selector only for this theme, you could do so by defining this below in this file:
          .theme_midnight_ocean .btn-full {
            padding: 50px;
          }
*/

/*
This first :root section is for setting any values of the main theme variables found in the 0_00_default_theme_vars.css file.
*/
:root {
    --primary: #2f75c1;         /* dark theme - slightly lighter or more saturated */
    --tertiary: #4ab8f2;
    --surface: #1a1d21;                 /* replaces white for containers */
    --main-background: #0f1113;         /* replaces light gray bg */
    --font__pri-clr: #ffffff;           /* not primary, just main readable text */
    --font__sec-clr: var(--surface);           /* not primary, just main readable text */
    --font__sec-clr: #2a2a2a;           /* not primary, just main readable text */
    --font__sec-clr: var(--gray-1);           /* not primary, just main readable text */

    --main-background: #0f1113;
    --foreground: #ffffff;
    --input-bg: #2a2a2a;
    --input-clr: #f0f0f0;

    --radio__bg: var(--surface);
    --radio__fill-clr: var(--white-1);
    --radio__hover-bg: var(--primary);

    --shadow-1: rgba(0,0,0,0.5);

    --notification__clr: #2a2a2a;
    --notification__clr: var(--foreground);

    --header_nav__clr: #b3b3b3;
    --header_nav__clr: var(--font__pri-clr);
    --header_nav__hover_clr: var(--surface);

    --link__pri-hover-clr: var(--surface);
    --link__pri-hover-clr: var(--font__sec-clr);
    --link__sec-hover-clr: #a1deff;

    --btn__clr-pri: var(--font__pri-clr);

    --article_preview__hover-clr: var(--font__pri-clr);
    --article_preview_suggestion_clr: var(--font__pri-clr);

    --dropdown__clr: var(--font__pri-clr);

    --search__clr: var(--font__pri-clr);
    --search__bg: var(--main-background);

    --shadow-1-hsla: 210, 90%, 90%;

    --shadow_smaller: 0 1px 2px 0;
    --shadow_smaller_invert: 0 -1px 2px 0;
    --shadow_small: 0 1px 2px 0;
    --shadow_med: 0 2px 4px 0;
    --shadow_blur-only: 0 0 5px 0;

    --shadow_dropdown_label: inset 1px 1px 1px;
    --shadow_dropdown_label_invert:  inset -1px -1px 1px;

    --table_row__bg: color-mix(in srgb, var(--primary) 23%, var(--surface));
    --table_row__bg-even: color-mix(in srgb, var(--tertiary) 1%, var(--surface));
    --table_row__bg-hover: color-mix(in srgb, var(--surface) 90%, var(--primary));

    --navlink__clr: var(--font__sec-clr);
    --navlink__hover-bg: color-mix(in srgb, var(--surface) 95%, var(--foreground));
    --header_profile__clr: var(--font__pri-clr);

    --preview__hover-bg: color-mix(in srgb, var(--surface) 98%, var(--foreground));
    --suggest_preview__clr: var(--font__sec-clr);
    --suggest_preview__hover-bg: var(--preview__hover-bg);

    --ticket_response__bg: var(--ticket_body__bg);

    --datepicker__clr: var(--tertiary);

    --success: var(--green-1);
    --success-2: #53c3a1;
    --success-2: var(--surface);
    --error: var(--red-1);
    --error-2: #c57979;
    --error-2: var(--surface);
    --warning: var(--yellow-1);
    --warning-2: #c5c574;
    --warning-2: var(--surface);
    --info: #4ab8f2;
    --info-2: #539cc8;
    --info-2: var(--surface);
    --info-3: #3a3a3a;

    --link__pri-clr: #4ab8f2;
    --breadcrumbs__a-clr: var(--link__pri-clr);
    --breadcrumbs__a-hover-clr: var(--link__sec-hover-clr);
    --preview__title-clr: var(--link__pri-clr);
    --navlink__title-clr: var(--link__pri-clr);
    --search__icon-fill: var(--link__pri-clr);
}

/* ADDITIONAL OVERWRITES BELOW - CSS helper vars, and general selector overwrites:
(needed for specifically desired themes, which are currently not part of admin variables.
They ALL require !important; to properly override followup loaded CSS!
*/
:root {
    /* make the border buttons the same as full */
    --btn_blue_border__border-clr: var(--btn_full_border-clr) !important;
    --btn_blue_border__clr: var(--btn_full_clr) !important;
    --btn_blue_border__bg: var(--btn_full_bg) !important;
    --btn_blue_border__hover_bg: var(--btn_full__hover_bg) !important;
    --datepicker_cell__selected-clr: var(--white-1) !important;
}
/* Exception, as we have to make it visible against dark background in this case! */
.selectize-control .selectize-input::after {
    transition: all var(--transition-time-sec) ease;
    color: var(--dropdown_input__hover-after-clr);
    fill: var(--dropdown_input__hover-after-fill);
    filter: brightness(0%) invert(100%);
    opacity: 1 !important;
}
.header .header__nav .profile__user .profile__menu .profile--logout a {
    color: var(--btn_full_clr);
}
.browser-default code {
    color: black !important;
}
.article__heading {
    color: var(--link__pri-clr) !important;
}
.notification.green p:first-child {
    color: var(--success);
}
.notification.red p:first-child {
    color: var(--error);
}
.notification.orange p:first-child {
    color: var(--warning);
}
.notification.blue p:first-child {
    color: var(--info);
}
.alert {
    background: color-mix(in srgb, var(--surface) 90%, var(--secondary)) !important;
}
.tabbed__head .tabbed__head_tabs li {
    color: var(--foreground) !important;
    background: var(--gray-7) !important;
}
.tabbed__head .tabbed__head_tabs li.current {
    background: var(--primary) !important;
    border-color: var(--surface) !important;
}
.cust-help .block__head .h-3 {
    color: var(--foreground);
}
.block__head .kb--folder a {
    color: var(--link__pri-clr);
}
#cc-link a {
    color: var(--foreground) !important;
}
.radio-custom [type="radio"] + label {
    color: var(--tertiary) !important;
}
.checkbox-custom [type="checkbox"]:checked + label::after,
.checkbox-custom [type="checkbox"]:not(:checked) + label::after {
    filter: invert(100%) brightness(200%);
}
.modal {
    background: var(--surface) !important;
}
.modal a.close-modal {
    filter: invert(100%);
    border-radius: 50%;
}
.modal a.close-modal:hover {
    filter: none !important;
    border: 1px solid white;
}
.table-wrap .table thead a {
    color: var(--foreground) !important;
}
.table thead th .handle {
    filter: invert(100%);
}
.table thead th a:hover .handle{
    filter: none;
}
.ticket__body_block .block--head .contact b {
    color: var(--primary) !important;
}
article.article .block__head .h-3 {
    color: var(--white-1) !important;
}
.form-group .form-control__error {
    background: none !important;
}
.radio-custom [type="radio"]:not(:checked) + label,
.radio-custom [type="radio"]:checked + label {
    color: var(--font__sec-clr) !important;
}
.checkbox-custom [type="checkbox"]:not(:checked) + label,
.checkbox-custom [type="checkbox"]:checked + label {
    color: var(--font__sec-clr) !important;
}
.ticket__body_block .block--head .contact b {
    color: var(--font__pri-clr) !important;
}
.ticket__body_block.response {
    border: 1px solid var(--success) !important;
}
.ticket__body_block.response .block--head .contact b {
    color: var(--success) !important;
}
.ticket__body_block h1 {
    color: var(--tertiary) !important;
}
.kb--folder a:hover {
    color: var(--link__sec-hover-clr) !important;
}
/* FsHub support theme. Loaded last by head.txt; no HESK asset rebuild needed. */
@font-face { font-family: Barlow; src: url('fonts/Barlow-Regular.ttf') format('truetype'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: Barlow; src: url('fonts/Barlow-SemiBold.ttf') format('truetype'); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: Barlow; src: url('fonts/Barlow-Bold.ttf') format('truetype'); font-weight: 700 900; font-style: normal; font-display: swap; }
:root {
    color-scheme: dark;
    --fshub-bg: #1b1e20;
    --fshub-panel: #15181b;
    --fshub-input: #111416;
    --fshub-nav: #0e1117;
    --fshub-border: #32363d;
    --fshub-text: #c9ccd3;
    --fshub-muted: #a2a7b0;
    --fshub-orange: #ff8700;
    --fshub-orange-hover: #ffa52e;
    --fshub-white: #f4f5f7;
    --primary: var(--fshub-orange);
    --secondary: var(--fshub-orange);
    --tertiary: var(--fshub-orange);
    --surface: var(--fshub-panel);
    --main-background: var(--fshub-bg);
    --foreground: var(--fshub-text);
    --font__pri-clr: var(--fshub-white);
    --font__sec-clr: var(--fshub-text);
    --input-bg: var(--fshub-input);
    --input-clr: var(--fshub-text);
    --header__bg: var(--fshub-nav);
    --header_border__clr: #744317;
    --header_nav__clr: var(--fshub-text);
    --header_nav__hover_clr: var(--fshub-orange);
    --header_logo__clr: var(--fshub-white);
    --link__pri-clr: var(--fshub-orange);
    --link__pri-hover-clr: var(--fshub-orange-hover);
    --link__sec-clr: var(--fshub-orange);
    --link__sec-hover-clr: var(--fshub-orange-hover);
    --breadcrumbs__a-clr: var(--fshub-muted);
    --breadcrumbs__a-hover-clr: var(--fshub-orange);
    --btn__bg-clr-pri: var(--fshub-orange);
    --btn__border-clr-pri: var(--fshub-orange);
    --btn__clr-pri: var(--fshub-input);
    --btn_full_clr: var(--fshub-input);
    --btn_full__hover_bg: var(--fshub-orange-hover);
    --btn_blue_border__bg: transparent !important;
    --btn_blue_border__clr: var(--fshub-text) !important;
    --btn_blue_border__border-clr: var(--fshub-border) !important;
    --btn_blue_border__hover_bg: var(--fshub-border) !important;
    --dropdown__bg: var(--fshub-input);
    --dropdown__clr: var(--fshub-text);
    --dropdown__border-clr: var(--fshub-border);
    --dropdown__hover-bg: var(--fshub-border);
    --dropdown__hover-clr: var(--fshub-white);
    --search__title-clr: var(--fshub-white);
    --search__input-bg: var(--fshub-input);
    --search__input-placeholder-clr: var(--fshub-muted);
    --search__icon-fill: var(--fshub-orange);
    --navlink__title-clr: var(--fshub-white);
    --navlink__clr: var(--fshub-text);
    --navlink__hover-bg: var(--fshub-panel);
    --preview__bg: var(--fshub-panel);
    --preview__clr: var(--fshub-text);
    --preview__border-clr: var(--fshub-border);
    --preview__hover-bg: var(--fshub-input);
    --preview__title-clr: var(--fshub-white);
    --suggest_preview__bg: var(--fshub-panel);
    --suggest_preview__clr: var(--fshub-text);
    --ticket_body__bg: var(--fshub-panel);
    --ticket_response__bg: var(--fshub-input);
    --modal_body__bg: var(--fshub-panel);
    --footer__link-clr: var(--fshub-muted);
    --radio__bg: var(--fshub-input);
    --radio__fill-clr: var(--fshub-orange);
    --checkbox__bg: var(--fshub-input);
    --notification__clr: var(--fshub-text);
    --dark-text: var(--fshub-text);
    --table_row__bg: var(--fshub-panel);
    --table_row__bg-even: var(--fshub-input);
    --table_row__bg-hover: var(--fshub-border);
}
html { background: var(--fshub-bg); }
body.cust-help { min-height: 100vh; height: auto; background: var(--fshub-bg); color: var(--fshub-text); font-family: Barlow, Arial, sans-serif; font-size: 16px; line-height: 1.5; }
.cust-help button, .cust-help input, .cust-help select, .cust-help textarea { font-family: inherit; }
.cust-help .wrapper { background: var(--fshub-bg); flex: 1 0 auto; }
.cust-help .contr { max-width: 1200px; padding: 0 24px; }
.cust-help .header { background: var(--fshub-nav); border-bottom: 1px solid var(--header_border__clr); }
.cust-help .header > .contr { max-width: 1800px; }
.cust-help .header__inner { min-height: 66px; padding: 10px 0; gap: 24px; }
.cust-help .header__logo { display: flex; align-items: center; flex: 0 0 auto; }
.cust-help .header__logo img { display: block; width: 41px; height: 35px; }
.fshub-nav, .fshub-support-nav { display: flex; align-items: center; gap: 26px; font-size: 16px; font-weight: 700; }
.fshub-nav a, .fshub-support-nav a { color: var(--fshub-text); white-space: nowrap; }
.fshub-nav a:hover, .fshub-support-nav a:hover { color: var(--fshub-orange); }
.fshub-support-nav { margin-left: auto; gap: 20px; }
.fshub-support-nav .fshub-support-home { color: var(--fshub-orange); }
.cust-help .header__inner .header__nav { flex-grow: 0; margin: 0; font-weight: 600; }
.cust-help .breadcrumbs { background: var(--fshub-bg); border-bottom: 0; }
.cust-help .breadcrumbs__inner { min-height: 50px; padding: 16px 0; font-size: 13px; color: var(--fshub-muted); }
.cust-help .breadcrumbs__inner .last { color: var(--fshub-text); }
.cust-help .main__content { padding: 18px 0 40px; }
.cust-help .help-search { margin: 0 0 28px; padding: 36px; text-align: left; border: 1px solid var(--fshub-border); border-radius: 12px; background: linear-gradient(112deg, #3b291f 0%, #12161c 45%, #20202e 100%); }
.fshub-eyebrow { color: var(--fshub-orange); font-size: 13px; font-weight: 700; letter-spacing: 1.6px; margin-bottom: 8px; }
.cust-help .search__title { font-size: clamp(28px, 3.1vw, 40px); font-weight: 400; line-height: 1.2; color: var(--fshub-white); margin: 0 0 14px; }
.fshub-hero-description { color: var(--fshub-text); font-size: 18px; max-width: 850px; line-height: 1.5; }
.cust-help .help-search .search { margin-top: 24px; }
.cust-help .nav { gap: 20px; margin: 28px 0; }
.cust-help .navlink { margin: 0; padding: 26px; border: 1px solid var(--fshub-border); border-radius: 10px; background: var(--fshub-panel); box-shadow: none; transition: border-color .15s, background .15s; }
.cust-help .navlink:hover { border-color: var(--fshub-orange); background: var(--fshub-input); }
.cust-help .navlink__title { color: var(--fshub-white); font-size: 21px; line-height: 1.35; }
.cust-help .navlink__descr { color: var(--fshub-muted); font-size: 16px; margin-top: 6px; }
.cust-help .navlink .icon-in-circle { background: color-mix(in srgb, var(--fshub-orange) 12%, var(--fshub-panel)); color: var(--fshub-orange); border: 1px solid #604022; border-radius: 10px; }
.cust-help .navlink .icon { fill: var(--fshub-orange); }
.cust-help .alert { border: 1px solid var(--fshub-border); border-left: 3px solid var(--fshub-orange); border-radius: 8px; background: var(--fshub-panel) !important; color: var(--fshub-text); box-shadow: none; margin: 18px 0; padding: 20px 24px; font-size: 16px; }
.cust-help .alert-title { color: var(--fshub-white); }
.cust-help .alert p { line-height: 1.6; }
.cust-help .article__heading, .cust-help .select__title, .cust-help .form__title { color: var(--fshub-white) !important; font-size: 30px; font-weight: 400; line-height: 1.3; }
.cust-help .article-heading-tip, .cust-help .lightgrey, .cust-help .text-muted { color: var(--fshub-muted); }
.cust-help .form { background: var(--fshub-panel); border: 1px solid var(--fshub-border); border-radius: 10px; padding: 30px; box-shadow: none; }
.cust-help .form .form { border: 0; padding: 0; }
.cust-help .form-group { margin-bottom: 24px; }
.cust-help .label { font-size: 14px; font-weight: 700; color: var(--fshub-text); line-height: 1.5; }
.cust-help .form-control, .cust-help input[type=email], .cust-help input[type=text], .cust-help input[type=password], .cust-help input[type=number], .cust-help input[type=search], .cust-help textarea, .cust-help select, .cust-help .selectize-input, .cust-help .selectize-input.input-active {
    background: var(--fshub-input); color: var(--fshub-text); border: 1px solid var(--fshub-border); border-radius: 6px; box-shadow: none; font-size: 17px; min-height: 46px; padding: 11px 14px;
}
.cust-help .selectize-input input { min-height: 0; padding: 0; border: 0; }
.cust-help textarea.form-control { min-height: 180px; line-height: 1.6; }
.cust-help ::placeholder { color: var(--fshub-muted); opacity: 1; }
.cust-help .form-control:focus, .cust-help input:focus, .cust-help textarea:focus, .cust-help select:focus, .cust-help .selectize-input.focus { outline: 2px solid var(--fshub-orange); outline-offset: 2px; border-color: var(--fshub-orange); box-shadow: none; }
.cust-help .selectize-dropdown, .cust-help .dropdown-list { background: var(--fshub-input); color: var(--fshub-text); border: 1px solid var(--fshub-border); border-radius: 6px; }
.cust-help .selectize-dropdown .active { background: var(--fshub-border); color: var(--fshub-white); }
.cust-help .btn { min-height: 42px; height: auto; border-radius: 6px; padding: 10px 20px; font-size: 16px; font-weight: 700; }
.cust-help .btn-full { background: var(--fshub-orange); border: 1px solid var(--fshub-orange); color: var(--fshub-input); }
.cust-help .btn-full:hover { background: var(--fshub-orange-hover); border-color: var(--fshub-orange-hover); color: var(--fshub-input); }
.cust-help .btn--blue-border, .cust-help .btn-border { background: transparent; border: 1px solid var(--fshub-border); color: var(--fshub-text); }
.cust-help .btn--blue-border:hover, .cust-help .btn-border:hover { background: var(--fshub-border); color: var(--fshub-white); }
.cust-help input[type=checkbox], .cust-help input[type=radio] { accent-color: var(--fshub-orange); }
.cust-help :focus-visible { outline: 2px solid var(--fshub-orange); outline-offset: 4px; }
.cust-help .dropzone { background: var(--fshub-input); color: var(--fshub-text); border: 1px dashed var(--fshub-border); border-radius: 6px; }
.cust-help .attachment-row, .cust-help .dropzone > .file-row:nth-child(even) { background: var(--fshub-panel); }
.cust-help .notification { border-radius: 8px; box-shadow: none; color: var(--fshub-text); }
.cust-help .ticket__body_block, .cust-help .content .block__head, .cust-help .block__content, .cust-help .ticket__body .form { background: var(--fshub-panel); color: var(--fshub-text); border-color: var(--fshub-border); }
.cust-help .ticket__body_block { border: 1px solid var(--fshub-border); border-radius: 8px; }
.cust-help .ticket__body_block .block--head { border-color: var(--fshub-border); }
.cust-help .browser-default code { background: var(--fshub-border); color: var(--fshub-white) !important; }
.cust-help .table { color: var(--fshub-text); }
.cust-help .table thead { background: var(--fshub-input); }
.cust-help .table th, .cust-help .table td { border-color: var(--fshub-border); }
.cust-help .footer { color: var(--fshub-muted); margin-top: 36px; font-size: 12px; background: transparent; }
.cust-help .footer a { color: var(--fshub-muted); }
.fshub-footer { background: var(--fshub-bg); color: var(--fshub-text); padding: 54px 0 36px; border-top: 1px solid #292d32; }
.fshub-footer-inner { width: 100%; max-width: 1200px; padding: 0 24px; margin: 0 auto; }
.fshub-footer-columns { display: grid; grid-template-columns: 1fr 1.1fr 1.1fr 1.7fr 1.35fr; gap: 28px; }
.fshub-footer-brand img { display: block; width: 113px; height: 109px; object-fit: contain; }
.fshub-footer h2 { color: var(--fshub-orange); font-size: 15px; font-weight: 700; text-transform: uppercase; line-height: 1.4; margin: 7px 0 20px; }
.fshub-footer ul { list-style: none; margin: 0; padding: 0; }
.fshub-footer li { margin: 0 0 14px; }
.fshub-footer a { color: #bfc1c5; text-decoration: none; font-size: 16px; }
.fshub-footer a:hover { color: var(--fshub-orange); }
.fshub-footer-bottom { display: flex; justify-content: space-between; align-items: center; gap: 24px; margin-top: 34px; }
.fshub-footer-bottom p { font-size: 16px; }
.fshub-footer-bottom nav { display: flex; flex-wrap: wrap; gap: 7px; }
.fshub-footer-bottom nav a { padding: 5px 12px; border: 1px solid #414449; border-radius: 22px; background: #2b2e31; font-size: 14px; line-height: 1.4; }
.fshub-footer-bottom nav a:hover { border-color: var(--fshub-orange); }
@media (max-width: 1100px) {
    .fshub-nav { gap: 16px; font-size: 14px; }
    .fshub-support-nav { gap: 14px; font-size: 14px; }
    .cust-help .header__inner { gap: 18px; }
    .fshub-footer-columns { grid-template-columns: .8fr 1fr 1fr 1.4fr 1.2fr; gap: 20px; }
}
@media (max-width: 850px) {
    .cust-help .header__inner { flex-wrap: wrap; gap: 12px 20px; }
    .fshub-nav { order: 3; width: 100%; gap: 22px; overflow-x: auto; padding: 8px 0 4px; font-size: 15px; }
    .fshub-support-nav { margin-left: auto; }
    .fshub-footer-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
    .fshub-footer-brand { grid-column: 1 / -1; }
    .fshub-footer-brand img { width: 76px; height: 74px; }
    .fshub-footer-bottom { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 600px) {
    .cust-help .contr, .fshub-footer-inner { padding: 0 20px; }
    .cust-help .header__inner { min-height: 60px; }
    .cust-help .header__logo img { width: 35px; height: 30px; }
    .cust-help .main__content { padding-top: 8px; }
    .cust-help .help-search { padding: 26px 22px; }
    .fshub-hero-description { font-size: 16px; }
    .cust-help .nav { flex-direction: column; gap: 14px; }
    .cust-help .navlink { width: 100%; padding: 22px; }
    .cust-help .navlink__title { font-size: 19px; }
    .cust-help .form { padding: 22px 18px; }
    .cust-help .alert { padding: 18px; }
    .cust-help .article__heading, .cust-help .select__title { font-size: 26px; }
    .fshub-footer { padding-top: 36px; }
    .fshub-footer-columns { column-gap: 20px; }
    .fshub-footer a { font-size: 15px; overflow-wrap: anywhere; }
    .fshub-footer h2 { font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
    .cust-help *, .cust-help *::before, .cust-help *::after { scroll-behavior: auto !important; transition: none !important; }
}
@media print {
    .fshub-nav, .fshub-support-nav, .fshub-footer { display: none; }
}
/* Keep the support actions prominent and the notices compact. */
.cust-help .help-search .search__title { text-align: left; }
.cust-help .main__content.notice-flash { padding: 0; margin: 18px 0; }
.cust-help .notice-flash .notification { margin: 0; padding: 20px 24px; border: 1px solid var(--fshub-border); background: var(--fshub-panel); font-size: 15px; line-height: 1.6; }
.cust-help .notification.blue p:first-child, .cust-help .notification.orange p:first-child { color: var(--fshub-orange); }
.cust-help .notification p + p { margin-top: 10px; }
.cust-help .nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); justify-content: stretch; }
.cust-help .nav .navlink { width: 100%; max-width: none; }
.page-index .cust-help .nav { margin-top: 0; }
@media (max-width: 600px) {
    .cust-help .nav { grid-template-columns: minmax(0, 1fr); }
    .cust-help .notice-flash .notification { padding: 18px; }
}
.cust-help .form input.form-control, .cust-help .form textarea.form-control {
    background: var(--fshub-input); color: var(--fshub-text); border: 1px solid var(--fshub-border); border-radius: 6px; padding: 11px 14px; font-family: inherit; font-size: 17px; min-height: 46px;
}
.cust-help .form input.form-control:focus, .cust-help .form textarea.form-control:focus { outline: 2px solid var(--fshub-orange); outline-offset: 2px; border-color: var(--fshub-orange); }
.cust-help .form input.form-control.isError, .cust-help .form textarea.form-control.isError { border-color: var(--error); }
.cust-help .form-submit-ticket { max-width: 900px; margin-left: auto; margin-right: auto; }
.cust-help .form-submit-ticket .form-group:not(#cc-link), .cust-help .form-submit-ticket .param { max-width: none; }
.cust-help .form-submit-ticket textarea.form-control { min-height: 220px; resize: vertical; }
.cust-help #cc-link { background: var(--fshub-input); border: 1px solid var(--fshub-border); border-radius: 6px; min-height: 42px; }
.cust-help #cc-link a { color: var(--fshub-text); font-size: 16px; font-weight: 600; }
.cust-help #cc-link:hover { border-color: var(--fshub-orange); }
.cust-help .btn.btn-refresh { min-height: 28px; width: 28px; height: 28px; padding: 6px; }
.cust-help .captcha-block { max-width: 100%; }
.cust-help .captcha-block .btn-refresh { position: static; display: inline-flex; vertical-align: middle; margin: 0 0 0 8px; }
.cust-help .main, .cust-help .form, .cust-help h1, .cust-help h2, .cust-help h3, .cust-help p, .cust-help label,
.cust-help .form input.form-control, .cust-help .form textarea.form-control { font-family: Barlow, Arial, sans-serif; }
.cust-help .form-submit-ticket .captcha-block { max-width: 300px; width: 100%; }

/* Tracking ID reminder: one compact form, without a second panel inside the dialog. */
.cust-help #forgot-modal.modal {
    width: 100%; max-width: 580px; padding: 28px;
    border: 1px solid var(--fshub-border); border-radius: 12px;
    color: var(--fshub-text); font-family: Barlow, Arial, sans-serif;
    font-size: 16px; line-height: 1.55;
}
.cust-help #forgot-modal #modal-contents { padding-bottom: 0 !important; }
.cust-help #forgot-modal #modal-contents > b:first-of-type {
    display: block; padding-right: 28px; margin-bottom: 14px;
    color: var(--fshub-white); font-size: 24px; line-height: 1.25;
}
.cust-help #forgot-modal #modal-contents > br { display: none; }
.cust-help #forgot-modal .form {
    display: flex; flex-direction: column; gap: 22px;
    margin-top: 22px; padding: 0; border: 0; border-radius: 0;
    background: transparent; box-shadow: none;
}
.cust-help #forgot-modal .form-group { width: 100%; max-width: none; margin: 0; }
.cust-help #forgot-modal label[for="forgot-email"] {
    position: static; display: block; width: auto; height: auto;
    margin: 0 0 8px; padding: 0; overflow: visible;
    clip: auto; clip-path: none; white-space: normal; transform: none;
    color: var(--fshub-text); font-size: 14px; font-weight: 600;
}
.cust-help #forgot-modal .radio-custom + .radio-custom { margin-top: 12px; }
.cust-help #forgot-modal .radio-custom label { margin: 0; padding-left: 28px; font-size: 16px; line-height: 1.4; }
.cust-help #forgot-modal .radio-custom label::before { top: 3px; }
.cust-help #forgot-modal .radio-custom label::after { top: 7px; }
.cust-help #forgot-modal .radio-custom:focus-within label { outline: 2px solid var(--fshub-orange); outline-offset: 4px; border-radius: 2px; }
.cust-help #forgot-modal .captcha-remind { width: 100%; max-width: none; }
.cust-help #forgot-modal .captcha-remind .form-group:has(img[name="secimg"]) {
    display: grid; grid-template-columns: 150px 36px minmax(0, 1fr);
    gap: 10px 12px; align-items: center;
}
.cust-help #forgot-modal img[name="secimg"] { grid-column: 1; grid-row: 1; display: block; width: 150px; height: 40px; }
.cust-help #forgot-modal .btn-refresh {
    position: static; grid-column: 2; grid-row: 1; margin: 0;
    width: 36px; height: 36px; padding: 8px;
    border: 1px solid var(--fshub-border); border-radius: 6px;
}
.cust-help #forgot-modal .btn-refresh:hover { background: var(--fshub-border); }
.cust-help #forgot-modal .captcha-remind label {
    grid-column: 1 / -1; grid-row: 2; margin: 0; padding-right: 16px;
    font-size: 14px; line-height: 1.5; color: var(--fshub-muted);
}
.cust-help #forgot-modal .captcha-remind input { grid-column: 1 / -1; grid-row: 3; width: 100%; }
.cust-help #forgot-modal #forgot-tid-submit {
    width: 100%; min-width: 0; min-height: 46px; margin: 0;
    padding: 12px 16px; line-height: 1.4; white-space: normal;
}
.cust-help #forgot-modal a.close-modal {
    top: 12px; right: 12px; width: 28px; height: 28px;
    opacity: .8;
}
.cust-help #forgot-modal a.close-modal:hover { opacity: 1; border: 0; filter: invert(100%); }
@media (max-width: 600px) {
    .cust-help #forgot-modal.modal { padding: 24px 20px; }
    .cust-help #forgot-modal #modal-contents > b:first-of-type { font-size: 22px; }
}

/* Brand link supplied by header.txt, without changing HESK's navigation template. */
.cust-help .fshub-header-brand {
    position: absolute; z-index: 2; top: 15px;
    left: max(24px, calc((100% - 1800px) / 2 + 24px));
    display: flex; align-items: center; justify-content: center;
    width: 41px; height: 35px; border-radius: 4px;
}
.cust-help .fshub-header-brand img { display: block; width: 41px; height: 35px; }
.cust-help .header__logo { margin-left: 65px; }
@media (max-width: 600px) {
    .cust-help .fshub-header-brand { left: 20px; width: 35px; height: 30px; }
    .cust-help .fshub-header-brand img { width: 35px; height: 30px; }
    .cust-help .header__logo { margin-left: 55px; }
}
