/* ============================================================
   TDC theme - TeenDrivingCourse (sitedata "tdc", WebsiteID 101).
   Loaded by BrandTheme after member-v2.css in all three V2 masters.
   The supplied public-site reference uses blue, orange, navy and white.
   Keep its bright accents; deeper action colors support readable labels.
   ============================================================ */

body.mv2.brand-tdc {
    --mv2-bg:           #f4f8fb;
    --mv2-surface:      #ffffff;
    --mv2-ink:          #073451;
    --mv2-ink-2:        #445a6a;
    --mv2-ink-3:        #5d6d79;
    --mv2-border:       #c8d9e4;
    --mv2-border-soft:  #dfe9f0;
    --mv2-primary:      #087ca8;
    --mv2-primary-dk:   #06648c;
    --mv2-primary-soft: #eaf6fc;
    --mv2-brand:        #c44812;
    --tdc-blue:         #2ea3d6;
    --tdc-orange:       #ff6b00;
    --tdc-orange-dark:  #a43d0f;
    --tdc-orange-soft:  #fff3ea;
    --mv2-radius:       10px;
    --mv2-radius-lg:    12px;
    --mv2-shadow:       0 1px 3px rgba(7, 52, 81, .06);
    --mv2-shadow-sm:    0 1px 2px rgba(7, 52, 81, .05);
}

/* Public-site white header and navy navigation, with the shared facelift's
   clipped full-width band so the header adds no horizontal overflow. */
body.mv2.brand-tdc .mv2-header {
    background: var(--mv2-surface);
    border: 0;
    border-radius: 0;
    padding: 18px 6px;
    gap: 20px;
    box-shadow: 0 0 0 100vmax #fff, 0 1px 0 100vmax var(--mv2-border-soft);
    clip-path: inset(-120px -100vmax -1px -100vmax);
    position: sticky;
    top: 0;
    z-index: 60;
    margin-bottom: 26px;
}
body.mv2.brand-tdc .mv2-logo img { max-height: 56px; }
/* Reuse the current public mark already shipped with the login page.
   The original image's alt text and home link remain in the master. */
body.mv2.brand-tdc:not(.brand-partner) .mv2-logo img {
    content: url('/images/login-logo-teendrivingcourse.webp');
}
body.mv2.brand-tdc .mv2-nav { gap: 4px; }
body.mv2.brand-tdc .mv2-nav a {
    color: var(--mv2-ink);
    font-weight: 600;
    border-radius: 6px;
    padding: 10px 12px;
}
body.mv2.brand-tdc .mv2-nav a:hover {
    background: var(--mv2-primary-soft);
    color: var(--mv2-primary-dk);
}
body.mv2.brand-tdc .mv2-nav li.active a,
body.mv2.brand-tdc .mv2-nav a.active {
    background: var(--mv2-primary-soft);
    color: var(--mv2-ink);
    box-shadow: inset 0 -3px var(--tdc-orange);
    font-weight: 700;
}
body.mv2.brand-tdc .mv2-header-right { gap: 16px; }
body.mv2.brand-tdc .mv2-phone {
    color: var(--mv2-ink);
    font-size: 15px;
    padding-right: 16px;
    border-right: 1px solid var(--mv2-border);
}
body.mv2.brand-tdc .mv2-signout { font-size: 14px; font-weight: 700; }

body.mv2.brand-tdc .mv2-footer {
    background: var(--mv2-ink);
    border-top: 3px solid var(--tdc-orange);
    color: #fff;
    padding: 26px 24px;
}
body.mv2.brand-tdc .mv2-footer a { color: #fff; text-decoration: underline; }

/* Cards, forms and profile actions inherit the TDC tokens. */
body.mv2.brand-tdc .mv2-tabs a { color: var(--mv2-ink-3); }
body.mv2.brand-tdc .mv2-tabs a:hover,
body.mv2.brand-tdc .mv2-tabs a.active { color: var(--mv2-ink); }
body.mv2.brand-tdc a:focus-visible,
body.mv2.brand-tdc button:focus-visible,
body.mv2.brand-tdc input[type="submit"]:focus-visible {
    outline: 2px solid var(--mv2-primary-dk);
    outline-offset: 3px;
}
body.mv2.brand-tdc .mv2-current-chapter { background: var(--mv2-primary-soft); }
body.mv2.brand-tdc .mv2-ring .mv2-ring-bg { stroke: #deebf3; }
body.mv2.brand-tdc .mv2-ring .mv2-ring-fg { stroke: var(--tdc-blue); }
body.mv2.brand-tdc .mv2-progress-bar { background: #deebf3; }
body.mv2.brand-tdc .mv2-progress-bar > i { background: var(--tdc-blue); }
body.mv2.brand-tdc .mv2-profile-cta a,
body.mv2.brand-tdc .mv2-viewall {
    background: var(--mv2-primary-soft);
    border-color: var(--mv2-border-soft);
    color: var(--mv2-primary-dk);
    border-radius: var(--mv2-radius);
}
body.mv2.brand-tdc .mv2-profile-cta a:hover,
body.mv2.brand-tdc .mv2-viewall:hover { background: #dceef8; }

/* Bright card borders mirror the logo; existing disabled actions stay muted. */
body.mv2.brand-tdc .mv2-upcard { border-top-color: var(--tdc-blue); }
body.mv2.brand-tdc .mv2-upcard.accent { border-top-color: var(--tdc-orange); }
body.mv2.brand-tdc .mv2-upcard.accent .mv2-upcard-media { background: var(--tdc-orange-soft); }
body.mv2.brand-tdc .mv2-upcard.accent .mv2-upcard-foot a:not(.disabled):not(.aspNetDisabled):hover {
    background: var(--tdc-orange-dark);
}

/* Referral and lesson accents; semantic success/error styles are retained. */
body.mv2.brand-tdc .mv2-refer {
    background: var(--mv2-ink);
    border-left: 4px solid var(--tdc-orange);
}
body.mv2.brand-tdc .mv2-refer .mv2-btn-white { color: var(--mv2-ink); }
body.mv2.brand-tdc .mv2-refer .mv2-btn-white:hover { background: var(--mv2-primary-soft); }
body.mv2.brand-tdc .mv2-raf-step-ico {
    background: var(--mv2-ink);
    box-shadow: 0 6px 18px -6px rgba(7, 52, 81, .3);
}
body.mv2.brand-tdc .mv2-raf-step-num {
    background: var(--mv2-brand);
    box-shadow: 0 4px 10px -3px rgba(196, 72, 18, .25);
}
body.mv2.brand-tdc .mv2-raf-copy { background: var(--mv2-primary); }
body.mv2.brand-tdc .mv2-raf-copy:hover { background: var(--mv2-primary-dk); }
body.mv2.brand-tdc .mv2-raf-stat.is-perref {
    background: var(--mv2-primary-soft);
    border-color: var(--mv2-border);
}
body.mv2.brand-tdc .mv2-raf-avatar { background: var(--mv2-primary); }
body.mv2.brand-tdc .mv2-lesson-avatar { background: var(--tdc-orange-soft); }
body.mv2.brand-tdc .mv2-lesson-progress .current-progress { background: var(--tdc-blue); }
body.mv2.brand-tdc .mv2-ef-prepcard { background: var(--tdc-orange-soft); }

/* Recolor the upload SVG/spinner while preserving the loading state. */
body.mv2.brand-tdc .mv2-upl-btn,
body.mv2.brand-tdc .mv2-upl-btn:hover {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23087ca8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 14.9A7 7 0 1 1 15.7 8h1.8a4.5 4.5 0 0 1 2.5 8.2'/%3E%3Cpolyline points='16 16 12 12 8 16'/%3E%3Cline x1='12' y1='12' x2='12' y2='21'/%3E%3C/svg%3E");
}
body.mv2.brand-tdc .mv2-upl-btnwrap.mv2-btn-loading .mv2-upl-btn { background-image: none; }
body.mv2.brand-tdc .mv2-upl-spinner {
    border-color: rgba(8, 124, 168, .3);
    border-top-color: var(--mv2-primary);
}

@media (max-width: 1100px) {
    body.mv2.brand-tdc .mv2-header { flex-wrap: wrap; position: static; }
    body.mv2.brand-tdc .mv2-header-right { margin-left: auto; }
    body.mv2.brand-tdc .mv2-nav { order: 3; width: 100%; justify-content: center; margin: 6px 0 0; }
}
@media (max-width: 720px) {
    body.mv2.brand-tdc .mv2-header { padding: 14px 0; gap: 14px; }
    body.mv2.brand-tdc .mv2-logo img { max-height: 46px; }
    body.mv2.brand-tdc .mv2-phone { border-right: 0; padding-right: 0; font-size: 14px; }
    body.mv2.brand-tdc .mv2-nav a { padding: 9px 11px; font-size: 14px; }
}
@media (max-width: 540px) {
    body.mv2.brand-tdc .mv2-header-right { width: 100%; justify-content: space-between; }
}