/*
   Go Fractional survey theme
   Dark, square-cornered look matching gofractional.com.
   Palette: ink #0B0B0C, surface #111113, line #2A2A2D, paper #F6F6FE,
            muted #BABAC0 / #86868A, blue #0042C2, blue light #4182FF.
*/
:root {
    --gf-ink: #0B0B0C;
    --gf-surface: #111113;
    --gf-surface-2: #17171A;
    --gf-line: #2A2A2D;
    --gf-paper: #F6F6FE;
    --gf-muted: #BABAC0;
    --gf-dim: #86868A;
    --gf-blue: #0042C2;
    --gf-blue-medium: #003496;
    --gf-blue-light: #4182FF;
    --gf-red: #FF6B6B;
    --bs-body-bg: var(--gf-ink);
    --bs-body-color: var(--gf-paper);
    --bs-border-color: var(--gf-line);
    --bs-primary: var(--gf-blue);
    --bs-primary-rgb: 0, 66, 194;
    --bs-link-color: var(--gf-blue-light);
    --bs-link-hover-color: #7AA6FF;
    --bs-border-radius: 0;
    --bs-font-sans-serif: "Helvetica Now Text", "HelveticaNow", "Helvetica Neue", Helvetica, Arial, sans-serif;
    color-scheme: dark;
}

html, body {
    background-color: var(--gf-ink) !important;
    color: var(--gf-paper) !important;
    font-family: var(--bs-font-sans-serif) !important;
    -webkit-font-smoothing: antialiased;
}

body * { border-radius: 0 !important; }

h1, h2, h3, h4, .survey-name, .group-title, .question-text {
    font-family: "Helvetica Now Display", "HelveticaNowDisplay", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 500;
    letter-spacing: -0.01em;
    color: var(--gf-paper);
}

a { color: var(--gf-blue-light); }
a:hover, a:focus { color: #7AA6FF; }

/* Top bar */
#survey-nav, .navbar, .top-container, .ls-top-bar {
    background-color: var(--gf-ink) !important;
    border-bottom: 1px solid var(--gf-line) !important;
    box-shadow: none !important;
}
#survey-nav .navbar-brand img, .logo-container img {
    max-height: 32px;
    width: auto;
}
.navbar a, .navbar .nav-link, .navbar-brand, .navbar .dropdown-toggle { color: var(--gf-paper) !important; }
.dropdown-menu { background: var(--gf-surface); border: 1px solid var(--gf-line); }
.dropdown-menu .dropdown-item { color: var(--gf-paper); }
.dropdown-menu .dropdown-item:hover { background: var(--gf-surface-2); color: var(--gf-paper); }

/* Welcome and end screens */
.survey-welcome, .welcome-container, .survey-description, .completed-text, .completed-wrapper, .survey-end {
    color: var(--gf-paper);
}
.survey-name { font-size: clamp(1.75rem, 3.5vw, 2.6rem); line-height: 1.15; }
.survey-welcome p, .completed-text p { color: var(--gf-muted); font-size: 1.1rem; line-height: 1.6; }
.survey-welcome strong { color: var(--gf-paper); }

/* Question cards */
.question-container {
    background-color: var(--gf-surface) !important;
    border: 1px solid var(--gf-line) !important;
    box-shadow: none !important;
    padding: 28px 28px 20px !important;
    margin-bottom: 20px !important;
}
.question-container.input-error, .question-container.has-error { border-color: var(--gf-red) !important; }
.question-title-container, .question-text, .ls-label-question { color: var(--gf-paper) !important; font-size: 1.2rem; }
.question-help-container, .ls-question-help, .ls-questionhelp, .questionhelp, .help-block, .form-text, .text-info, .ls-em-tip {
    color: var(--gf-dim) !important;
}
.asterisk, .text-danger, .ls-em-error, .em_q_fn_validation.text-danger { color: var(--gf-red) !important; }
.group-title { font-size: 1.5rem; margin: 8px 0 18px; }
.group-description { color: var(--gf-muted); }

/* Answer options: radio and checkbox rows */
.answer-item, .radio-item, .checkbox-item, .answer-container .answer-item {
    color: var(--gf-paper);
}
.ls-answers .radio-item label, .ls-answers .checkbox-item label,
.radio-item label, .checkbox-item label, .answer-item label {
    color: var(--gf-paper) !important;
}
.radio-item label::before, .checkbox-item label::before {
    background-color: var(--gf-ink) !important;
    border: 1px solid #505053 !important;
}
.radio-item input:checked + label::before, .checkbox-item input:checked + label::before {
    background-color: var(--gf-blue) !important;
    border-color: var(--gf-blue) !important;
}
.radio-item input:checked + label::after, .checkbox-item input:checked + label::after { color: #fff !important; }
.radio-item input:focus-visible + label::before, .checkbox-item input:focus-visible + label::before {
    outline: 2px solid var(--gf-blue-light);
    outline-offset: 2px;
}
.radio-item:hover label::before, .checkbox-item:hover label::before { border-color: var(--gf-blue-light) !important; }

/* Bootstrap check inputs (if used) */
.form-check-input { background-color: var(--gf-ink); border-color: #505053; }
.form-check-input:checked { background-color: var(--gf-blue); border-color: var(--gf-blue); }

/* Text inputs and selects */
.form-control, .form-select, input[type="text"], input[type="email"], input[type="number"], textarea, select {
    background-color: var(--gf-ink) !important;
    color: var(--gf-paper) !important;
    border: 1px solid #3A3A3E !important;
    box-shadow: none !important;
}
.form-control::placeholder, textarea::placeholder { color: var(--gf-dim); }
.form-control:focus, .form-select:focus, input:focus, textarea:focus, select:focus {
    border-color: var(--gf-blue-light) !important;
    outline: none !important;
    box-shadow: 0 0 0 1px var(--gf-blue-light) !important;
}

/* Array (agree/disagree grid) */
.ls-answers table, table.ls-answers, .question-container table, .table {
    --bs-table-bg: transparent;
    --bs-table-color: var(--gf-paper);
    --bs-table-striped-bg: rgba(246, 246, 254, 0.03);
    --bs-table-striped-color: var(--gf-paper);
    --bs-table-hover-bg: rgba(65, 130, 255, 0.08);
    --bs-table-hover-color: var(--gf-paper);
    color: var(--gf-paper) !important;
    background: transparent !important;
    border-color: var(--gf-line) !important;
}
.question-container table th, .question-container table td,
.ls-answers table th, .ls-answers table td {
    background-color: transparent !important;
    color: var(--gf-paper) !important;
    border-color: var(--gf-line) !important;
}
.question-container table thead th, .ls-heading th { color: var(--gf-muted) !important; font-weight: 500; }
.answertext, .answer-text { color: var(--gf-paper) !important; }
.ls-answers tr.ls-odd, .ls-answers tbody tr:nth-of-type(odd) > * { background-color: rgba(246, 246, 254, 0.025) !important; }

/* Buttons */
.btn { font-weight: 500; letter-spacing: 0.01em; padding: 12px 26px; }
.btn-primary, .ls-move-next-btn, .ls-move-submit-btn, #ls-button-submit, .action--ls-button-submit {
    background-color: var(--gf-blue) !important;
    border-color: var(--gf-blue) !important;
    color: #F8FAFC !important;
}
.btn-primary:hover, .btn-primary:focus, .ls-move-next-btn:hover, .ls-move-submit-btn:hover {
    background-color: var(--gf-blue-medium) !important;
    border-color: var(--gf-blue-medium) !important;
}
.btn-outline-secondary, .btn-secondary, .btn-default, .ls-move-previous-btn, .ls-clearall {
    background-color: transparent !important;
    border: 1px solid #3A3A3E !important;
    color: var(--gf-paper) !important;
}
.btn-outline-secondary:hover, .btn-secondary:hover, .btn-default:hover, .ls-move-previous-btn:hover {
    border-color: var(--gf-paper) !important;
    background-color: transparent !important;
}
.btn:focus-visible { outline: 2px solid var(--gf-blue-light) !important; outline-offset: 2px; }

/* Progress bar */
.progress, .ls-progress { background-color: var(--gf-line) !important; height: 6px !important; }
.progress-bar { background-color: var(--gf-blue-light) !important; color: transparent !important; font-size: 0; }

/* Alerts and notices */
.alert, .ls-questions-have-errors, .modal-content, .card, .well, .jumbotron {
    background-color: var(--gf-surface) !important;
    border: 1px solid var(--gf-line) !important;
    color: var(--gf-paper) !important;
}
.alert-danger, .alert-warning { border-left: 3px solid var(--gf-red) !important; }
.modal-header, .modal-footer { border-color: var(--gf-line) !important; }
.btn-close { filter: invert(1); }

/* Footer and powered-by */
.poweredby, .ls-poweredby, .footer, footer { color: var(--gf-dim) !important; }
.poweredby img, .ls-poweredby img { opacity: 0.4; filter: invert(1); }

/* Privacy notice and misc panels */
.privacy, .ls-privacy-body, .datasecurity_notice { color: var(--gf-muted) !important; }

::selection { background: rgba(65, 130, 255, 0.35); color: var(--gf-paper); }
