/* EE Scorecard Frontend Styles — All colors/sizes via CSS variables */
.ee-scorecard-wrap * { box-sizing: border-box; }
.ee-scorecard-wrap {
    font-family: var(--ee-font);
    background: var(--ee-bg);
    min-height: 100vh;
    color: var(--ee-body-color);
    padding: 24px;
}

/* Hero / Title */
.ees-hero { max-width: 1100px; margin: 0 auto 24px; }
.ees-title { font-size: var(--ee-heading-size); font-weight: var(--ee-heading-weight); color: var(--ee-body-color); margin: 0 0 8px; letter-spacing: -.02em; }
.ees-subtitle { font-size: 15px; color: var(--ee-muted); margin: 0; line-height: 1.5; }

/* Layout */
.ees-layout { max-width: 1100px; margin: 0 auto; display: flex; gap: 24px; align-items: flex-start; }
.ees-left { flex: 1; min-width: 0; }
.ees-right { width: 300px; flex-shrink: 0; position: sticky; top: 16px; }

/* Entry / Business Profile Card */
.ees-entry-card { background: var(--ee-card-bg); border: 1px solid var(--ee-card-border); border-radius: 12px; margin-bottom: 16px; overflow: hidden; }
.ees-entry-card.complete { border-color: var(--ee-card-active); }
.ees-entry-header { padding: 16px 20px; display: flex; align-items: center; gap: 14px; }
.ees-entry-icon { font-size: 20px; flex-shrink: 0; }
.ees-entry-info { flex: 1; }
.ees-entry-title { font-size: 15px; font-weight: 700; color: var(--ee-body-color); }
.ees-entry-sub { font-size: 12px; color: var(--ee-muted); margin-top: 2px; }
.ees-entry-status { font-size: 12px; flex-shrink: 0; }
.ees-entry-body { padding: 0 20px 20px; border-top: 1px solid var(--ee-card-border); }
.ees-entry-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 16px; }
.ees-ef-wrap { display: flex; flex-direction: column; gap: 6px; }
.ees-ef-label { font-size: 12px; color: var(--ee-muted); font-weight: 500; }
.ees-ef-input { width: 100%; background: var(--ee-a-bg); border: 1px solid var(--ee-a-border); border-radius: 8px; color: var(--ee-body-color); padding: 9px 12px; font-size: 13px; outline: none; font-family: var(--ee-font); transition: border-color .15s; }
.ees-ef-input:focus { border-color: var(--ee-primary); }
.ees-ef-input option { background: #111827; color: #f9fafb; }
.ees-entry-btn { width: 100%; margin-top: 16px; background: linear-gradient(135deg, var(--ee-cta-start), var(--ee-cta-end)); border: none; border-radius: 8px; padding: 13px; font-size: 14px; font-weight: 700; color: var(--ee-cta-color); cursor: pointer; font-family: var(--ee-font); transition: opacity .15s; }
.ees-entry-btn:hover:not(:disabled) { opacity: .9; }
.ees-cyl-locked { background: var(--ee-card-bg); border: 1px solid var(--ee-card-border); border-radius: 12px; padding: 32px; text-align: center; margin-bottom: 16px; }

/* Cylinders */
.ees-cyl { background: var(--ee-card-bg); border: 1px solid var(--ee-card-border); border-radius: 12px; margin-bottom: 12px; overflow: hidden; transition: border-color .2s; }
.ees-cyl.open { border-color: var(--ee-card-active); }
.ees-ct { width: 100%; background: none; border: none; padding: 16px 20px; cursor: pointer; display: flex; align-items: center; gap: 12px; text-align: left; color: var(--ee-body-color); font-family: var(--ee-font); }
.ees-cn { background: var(--ee-badge-inactive); color: var(--ee-subtitle); border-radius: 50%; width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; flex-shrink: 0; }
.ees-cn.act { background: var(--ee-badge-active); color: #000; }
.ees-ci { flex: 1; }
.ees-cn2 { font-size: var(--ee-cyl-name-size); font-weight: var(--ee-cyl-name-weight); }
.ees-cl { font-size: var(--ee-cyl-label-size); color: var(--ee-subtitle); }
.ees-cm { display: flex; align-items: center; gap: 10px; }
.ees-cc { font-size: 12px; color: var(--ee-subtitle); }
.ees-cb { padding: 0 20px 20px; border-top: 1px solid var(--ee-card-border); }

/* Questions */
.ees-q { margin-top: 16px; }
.ees-ql { font-size: var(--ee-q-size); font-weight: var(--ee-q-weight); color: #d1d5db; margin-bottom: 8px; }
.ees-tip { cursor: help; color: var(--ee-tooltip); font-size: 11px; background: var(--ee-badge-inactive); border-radius: 50%; width: 16px; height: 16px; display: inline-flex; align-items: center; justify-content: center; margin-left: 6px; font-weight: 700; border: 1px solid var(--ee-a-border); }

/* Answer Options */
.ees-og { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.ees-o { background: var(--ee-a-bg); border: 1px solid var(--ee-a-border); border-radius: 8px; padding: 9px 12px; font-size: var(--ee-a-size); font-weight: var(--ee-a-weight); color: var(--ee-muted); cursor: pointer; text-align: left; line-height: 1.4; transition: all .15s; font-family: var(--ee-font); }
.ees-o:hover { border-color: var(--ee-subtitle); color: #d1d5db; }
.ees-o.sel { background: var(--ee-a-sel-bg); border-color: var(--ee-a-sel-color); color: var(--ee-a-sel-color); }

/* Sidebar Cards */
.ees-rc { background: var(--ee-sidebar-bg); border: 1px solid var(--ee-card-border); border-radius: 12px; padding: 20px; }
.ees-rh { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.ees-rs { font-size: var(--ee-sidebar-heading-size); font-weight: var(--ee-sidebar-heading-weight); letter-spacing: .08em; text-transform: uppercase; color: var(--ee-subtitle); margin-bottom: 4px; }
.ees-rl { font-size: 13px; font-weight: 600; }
.ees-grade { font-size: var(--ee-grade-size); font-weight: var(--ee-grade-weight); line-height: 1; text-align: center; }
.ees-gs { font-size: var(--ee-sidebar-score-size); color: var(--ee-subtitle); margin-top: 2px; font-weight: var(--ee-sidebar-score-weight); }
.ees-bw { background: var(--ee-progress-bg); border-radius: 6px; height: 8px; overflow: hidden; margin-bottom: 16px; }
.ees-b { height: 100%; border-radius: 6px; transition: width .4s; }
.ees-prog { display: flex; justify-content: space-between; font-size: var(--ee-sidebar-prog-size); color: var(--ee-subtitle); margin-bottom: 14px; }
.ees-bars { border-top: 1px solid var(--ee-card-border); padding-top: 14px; }
.ees-br { display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto auto; gap: 2px 8px; align-items: center; margin-bottom: 10px; }
.ees-brl { font-size: var(--ee-sidebar-label-size); font-weight: var(--ee-sidebar-label-weight); color: var(--ee-muted); }
.ees-bbg { background: var(--ee-progress-bg); border-radius: 4px; height: 5px; }
.ees-bf { height: 100%; border-radius: 4px; transition: width .4s; }

/* Valuation */
.ees-vr { display: flex; justify-content: space-between; font-size: 12px; color: var(--ee-muted); margin-bottom: 6px; }
.ees-vbg { background: var(--ee-progress-bg); border-radius: 4px; height: 6px; }
.ees-gap { background: rgba(197,160,89,.1); border: 1px solid rgba(197,160,89,.3); border-radius: 8px; padding: 10px 12px; margin-top: 12px; }

/* Benchmarks */
.ees-bench-row { display: flex; align-items: center; gap: 8px; padding: 6px 0; font-size: 12px; color: var(--ee-muted); }
.ees-bench-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.ees-bench-row span:nth-child(2) { flex: 1; }
.ees-bench-range { font-weight: 700; font-size: 12px; }

/* CTA Button */
.ees-cta { width: 100%; background: linear-gradient(135deg, var(--ee-cta-start), var(--ee-cta-end)); border: none; border-radius: var(--ee-cta-radius); padding: 14px; font-size: var(--ee-cta-size); font-weight: var(--ee-cta-weight); color: var(--ee-cta-color); cursor: pointer; margin-top: 12px; letter-spacing: .02em; transition: opacity .15s; font-family: var(--ee-font); }
.ees-cta:hover { opacity: .9; }
.ees-ctasub { text-align: center; font-size: 11px; color: var(--ee-subtitle); margin-top: 6px; }

/* Modal */
.ees-modal { position: fixed; inset: 0; background: rgba(0,0,0,.7); display: flex; align-items: center; justify-content: center; z-index: 9999; overflow-y: auto; padding: 24px; }
.ees-mb { background: var(--ee-modal-bg); border: 1px solid var(--ee-modal-border); border-radius: 16px; padding: 32px; width: 100%; max-width: 440px; position: relative; overflow: visible; }
.ees-mb h3 { color: var(--ee-body-color); margin: 0 0 8px; font-size: var(--ee-modal-heading-size); }
.ees-mb p { color: var(--ee-muted); font-size: 14px; margin: 0 0 20px; }
.ees-mc { position: absolute; top: 16px; right: 16px; background: none; border: none; color: var(--ee-subtitle); font-size: 18px; cursor: pointer; }
.ees-mi { width: 100%; background: var(--ee-modal-input-bg); border: 1px solid var(--ee-modal-input-border); border-radius: 8px; color: var(--ee-body-color); padding: 12px; font-size: 14px; outline: none; margin-bottom: 10px; display: block; font-family: var(--ee-font); }
.ees-sl { font-size: 12px; color: var(--ee-subtitle); display: flex; align-items: flex-start; gap: 8px; margin-bottom: 12px; cursor: pointer; line-height: 1.5; }
.ees-sl input[type="checkbox"] { margin-top: 2px; flex-shrink: 0; }
.ees-gdpr-label { border: 1px solid var(--ee-card-border); border-radius: 8px; padding: 10px 12px; margin-bottom: 16px; font-size: 12px; color: var(--ee-muted); }
.ees-sub { width: 100%; background: linear-gradient(135deg, var(--ee-cta-start), var(--ee-cta-end)); border: none; border-radius: 8px; padding: 14px; font-size: 15px; font-weight: 700; color: var(--ee-cta-color); cursor: pointer; font-family: var(--ee-font); }
.ees-promo-block { background: rgba(197,160,89,.08); border: 1px solid rgba(197,160,89,.25); border-radius: 10px; padding: 14px 16px; margin-bottom: 14px; }
.ees-promo-heading { font-size: 14px; font-weight: 700; color: var(--ee-primary, #c5a059); margin-bottom: 4px; }
.ees-promo-subheading { font-size: 12px; font-weight: 600; color: var(--ee-body-color); margin-bottom: 8px; opacity: .85; }
.ees-promo-text { font-size: 13px; line-height: 1.6; color: var(--ee-muted); white-space: pre-wrap; }
.ees-promo-inline { max-width: 1100px; margin: 0 auto 20px; padding: 18px 22px; border-radius: 12px; }

/* ---- intl-tel-input: comprehensive dark theme overrides ---- */

/* Critical show/hide toggle — the library adds/removes iti__hide on the
   country-list to open/close the dropdown.  The display:none rule lives
   in the library's own CSS; if that CDN file fails to load or loads late,
   the dropdown stays permanently visible.  Defining it here guarantees
   the toggle always works. */
.iti__hide  { display: none !important; }
.iti__v-hide { visibility: hidden !important; }

/* On mobile the library moves the dropdown into a body-level
   .iti--container. Its default z-index (1060) sits behind our
   modal (9999), so bump it above. */
.iti--container { z-index: 100000 !important; }

/* Container */
.ees-mb .iti { width: 100%; margin-bottom: 10px; position: relative; display: block; overflow: visible; }

/* Selected flag area */
.ees-mb .iti__flag-container {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    padding: 0;
    z-index: 10;
}
.ees-mb .iti__selected-flag {
    display: flex;
    align-items: center;
    gap: 6px;
    height: 100%;
    padding: 0 12px;
    background: var(--ee-modal-input-bg);
    border: 1px solid var(--ee-modal-input-border);
    border-right: none;
    border-radius: 8px 0 0 8px;
    cursor: pointer;
}
.ees-mb .iti__selected-dial-code { color: var(--ee-body-color); font-size: 13px; }
.ees-mb .iti__arrow { border-top: 4px solid var(--ee-body-color, #f9fafb); border-left: 3px solid transparent; border-right: 3px solid transparent; margin-left: 4px; }
.ees-mb .iti__arrow--up { border-top: none; border-bottom: 4px solid var(--ee-body-color, #f9fafb); }

/* Phone input field */
.ees-mb .iti input[type="tel"] {
    width: 100%;
    background: var(--ee-modal-input-bg);
    border: 1px solid var(--ee-modal-input-border);
    border-radius: 0 8px 8px 0;
    color: var(--ee-body-color);
    padding: 12px 12px 12px 90px;
    font-size: 14px;
    outline: none;
    font-family: var(--ee-font);
    box-sizing: border-box;
}
.ees-mb .iti--separate-dial-code input[type="tel"] {
    padding-left: 0;
}

/* ---- Country dropdown list (renders inside modal) ---- */
.iti__country-list {
    position: absolute !important;
    z-index: 999999 !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    max-height: 220px !important;
    min-width: 280px !important;
    width: 280px !important;
    background: #111827 !important;
    border: 1px solid #374151 !important;
    border-radius: 8px !important;
    box-shadow: 0 12px 40px rgba(0,0,0,.8) !important;
    -webkit-overflow-scrolling: touch;
}

/* Individual country rows */
.iti__country {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 8px 12px !important;
    cursor: pointer !important;
    font-size: 13px !important;
    color: #f9fafb !important;
    list-style: none !important;
    margin: 0 !important;
}
.iti__country:hover,
.iti__country.iti__highlight {
    background: rgba(197,160,89,0.15) !important;
}

/* Country name and dial code inside dropdown */
.iti__country-name {
    color: #f9fafb !important;
    font-size: 13px !important;
    flex: 1;
}
.iti__dial-code {
    color: #9ca3af !important;
    font-size: 12px !important;
}

/* Flag icon sizing in dropdown */
.iti__country .iti__flag { margin-right: 0; }

/* Preferred countries divider */
.iti__divider {
    border-bottom: 1px solid #374151 !important;
    margin: 4px 0 !important;
    padding: 0 !important;
}

/* Search input inside dropdown (if enabled) */
.iti__search-input {
    background: #0d1117 !important;
    border: 1px solid #374151 !important;
    color: #f9fafb !important;
    padding: 8px 12px !important;
    font-size: 13px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    outline: none !important;
    border-radius: 0 !important;
}

/* Scrollbar styling for dark theme */
.iti__country-list::-webkit-scrollbar { width: 6px; }
.iti__country-list::-webkit-scrollbar-track { background: #111827; border-radius: 0 8px 8px 0; }
.iti__country-list::-webkit-scrollbar-thumb { background: #374151; border-radius: 3px; }
.iti__country-list::-webkit-scrollbar-thumb:hover { background: #4b5563; }

/* Thank You */
.ees-ty { max-width: 860px; margin: 16px auto 40px; text-align: center; padding: 0 24px; }
.ees-ty h2 { font-size: 28px; color: var(--ee-body-color); margin-bottom: 12px; }
.ees-ty > p { color: var(--ee-muted); font-size: 16px; margin-bottom: 24px; }
.ee-scorecard-wrap.state-thanks { padding-top: 0; }

/* Grid layout builder rows */
.ees-ty-grid-row { display: grid; gap: 16px; margin-bottom: 16px; text-align: left; }
.ees-ty-grid-row.cols-1 { grid-template-columns: 1fr; }
.ees-ty-grid-row.cols-2 { grid-template-columns: 1fr 1fr; }
.ees-ty-grid-row.cols-3 { grid-template-columns: 1fr 1fr 1fr; }
.ees-ty-grid-row > * { margin-bottom: 0 !important; }

/* Two-column row layout (legacy) */
.ees-ty-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; text-align: left; }
.ees-ty-row .ees-ty-card { margin-bottom: 0; }
.ees-ty-row .ees-vid { margin-bottom: 0; }
.ees-ty-row .ees-pitch { margin-bottom: 0; }

.ees-ty-card { background: var(--ee-card-bg); border: 1px solid var(--ee-card-border); border-radius: 12px; padding: 24px; margin-bottom: 16px; text-align: center; }
.ees-ty-card-label { font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ee-muted); margin-bottom: 4px; }
.ees-vid { background: var(--ee-card-bg); border: 1px solid var(--ee-card-border); border-radius: 12px; padding: 24px; overflow: hidden; margin-bottom: 16px; }
.ees-vid-full { margin-bottom: 20px; }
.ees-vid-full .ees-vid { margin-bottom: 0; }
.ees-vid iframe, .ees-vid video { display: block; width: 100%; border-radius: 8px; }
.ees-pitch { background: var(--ee-card-bg); border: 1px solid var(--ee-primary); border-radius: 12px; padding: 28px; text-align: center; }
.ees-pitch h3 { color: var(--ee-body-color); margin-top: 0; }
.ees-pitch ul { color: var(--ee-muted); line-height: 2; padding-left: 0; list-style: none; }

@media (max-width: 640px) {
    .ees-ty-row { grid-template-columns: 1fr; }
    .ees-ty-grid-row.cols-2,
    .ees-ty-grid-row.cols-3 { grid-template-columns: 1fr; }
    .ees-ty { max-width: 100%; }
}

/* Locked bar — animated shimmer to signal "there's data here" */
.ees-locked-bar {
    background: linear-gradient(90deg, #1f2937 25%, #374151 50%, #1f2937 75%);
    background-size: 200% 100%;
    animation: ees-shimmer 2s infinite;
}
@keyframes ees-shimmer {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}
.ees-gate-msg { border-top: 1px solid var(--ee-card-border); margin-top: 10px; }

/* Responsive */
@media(max-width:768px) {
    .ees-layout { flex-direction: column; }
    .ees-right { width: 100%; position: static; }
    .ees-og { grid-template-columns: 1fr; }
    .ees-entry-fields { grid-template-columns: 1fr; }
}

/* Share row (F) */
.ees-share-row { margin-top:24px; text-align:center; }
.ees-share-label { font-size:12px; color:var(--ee-muted); margin-bottom:10px; text-transform:uppercase; letter-spacing:.06em; font-weight:600; }
.ees-share-btns { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; }
.ees-share-btn { display:inline-flex; align-items:center; gap:6px; padding:8px 16px; border-radius:6px; font-size:13px; font-weight:600; text-decoration:none; cursor:pointer; border:none; font-family:inherit; transition:opacity .15s; }
.ees-share-btn:hover { opacity:.85; text-decoration:none; }
.ees-share-li { background:#0077b5; color:#fff; }
.ees-share-tw { background:#000; color:#fff; }
.ees-share-fb { background:#1877f2; color:#fff; }
.ees-share-em { background:#374151; color:#fff; }
.ees-share-cp { background:#e5e7eb; color:#374151; }
/* Redirect bar (C) */
.ees-redirect-bar { background:var(--ee-card-bg); border:1px solid var(--ee-card-border); border-radius:8px; padding:10px 18px; font-size:13px; color:var(--ee-muted); margin-bottom:16px; }
/* Price line (strikethrough + price) */
.ees-price-line { text-align:center; font-size:13px; color:var(--ee-muted); margin-top:10px; margin-bottom:4px; }
.ees-price-line s { color:var(--ee-muted); opacity:.7; }
.ees-price-line strong { color:var(--ee-body-color); font-size:15px; }