/*
 * Tim-IT V6.3 — infrastructure brand layer
 * Loaded after V6.2. It keeps all existing component structure and behaviour,
 * but applies the visual language of the public Tim-IT site: warm paper,
 * near-black surfaces, ruby red accents and editorial typography.
 */

:root {
    --timit-red: #e31b1d;
    --timit-red-dark: #b91218;
    --timit-red-soft: #fff0ef;
    --timit-black: #121213;
    --timit-charcoal: #242124;
    --timit-paper: #f5f2ed;
    --timit-card: #fffdf9;
    --timit-line: #e7e0d8;
    --timit-muted: #6f6969;
    --timit-cream: #eee7df;
    --timit-success: #14734f;
    --timit-success-soft: #e9f6ef;
    --timit-warning: #9b5c0d;
    --timit-warning-soft: #fff2dc;
    --timit-danger: #a52c40;
    --timit-danger-soft: #fff0f2;
}

.infra-v62 {
    --infra-bg: var(--timit-paper);
    --infra-surface: var(--timit-card);
    --infra-surface-soft: #faf7f2;
    --infra-surface-muted: #f0eae3;
    --infra-ink: #29272a;
    --infra-muted: var(--timit-muted);
    --infra-subtle: #948c87;
    --infra-line: var(--timit-line);
    --infra-line-strong: #d8d0c8;
    --infra-primary: var(--timit-red);
    --infra-primary-dark: var(--timit-red-dark);
    --infra-primary-soft: var(--timit-red-soft);
    --infra-navy: var(--timit-black);
    --infra-navy-soft: var(--timit-charcoal);
    --infra-cyan: var(--timit-red);
    --infra-cyan-soft: var(--timit-red-soft);
    --infra-success: var(--timit-success);
    --infra-success-soft: var(--timit-success-soft);
    --infra-warning: var(--timit-warning);
    --infra-warning-soft: var(--timit-warning-soft);
    --infra-danger: var(--timit-danger);
    --infra-danger-soft: var(--timit-danger-soft);
    --infra-shadow-sm: 0 7px 22px rgba(35, 26, 23, .065);
    --infra-shadow: 0 18px 46px rgba(35, 26, 23, .10);
    --infra-shadow-lg: 0 30px 78px rgba(20, 13, 12, .18);
    color: var(--infra-ink);
    background:
        radial-gradient(circle at 94% 2%, rgba(227, 27, 29, .08), transparent 25rem),
        radial-gradient(circle at 0 42%, rgba(185, 18, 24, .045), transparent 26rem),
        linear-gradient(rgba(255,255,255,.16) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.16) 1px, transparent 1px),
        var(--timit-paper);
    background-size: auto, auto, 34px 34px, 34px 34px, auto;
}

.infra-v62 :where(h1, h2, h3, h4),
body.infra-v62-legacy main :where(h1, h2, h3, h4) {
    font-family: Georgia, "Times New Roman", serif;
    font-weight: 700;
    letter-spacing: -.035em;
}

.infra-v62 :where(p, li, small, label, input, select, textarea, button, a, code, pre),
body.infra-v62-legacy main {
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* Topbar and wordmark */
.infra-v62 .ops-topbar {
    min-height: 74px;
    padding: 10px 12px 10px 16px;
    border-color: rgba(255,255,255,.08);
    background:
        radial-gradient(circle at 12% -70%, rgba(227,27,29,.32), transparent 19rem),
        linear-gradient(135deg, #151516, #09090a);
    box-shadow: 0 18px 48px rgba(12, 8, 8, .22);
}

.infra-v62 .ops-brand {
    min-width: 270px;
    color: #fff;
}

.infra-v62 .ops-brand-mark {
    position: relative;
    display: inline-flex;
    width: 92px;
    height: 43px;
    flex: 0 0 92px;
    align-items: center;
    justify-content: center;
    gap: 0;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.8);
    border-radius: 11px;
    color: transparent;
    background: #fff;
    box-shadow: 0 11px 30px rgba(0,0,0,.28);
    font-size: 0;
}

.infra-v62 .ops-brand-mark::before,
.infra-v62 .ops-brand-mark::after {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.05rem;
    font-weight: 950;
    letter-spacing: -.055em;
}
.infra-v62 .ops-brand-mark::before { content: "TIM"; color: var(--timit-red); }
.infra-v62 .ops-brand-mark::after { content: "-IT"; color: var(--timit-black); }

.infra-v62 .ops-brand strong { color: #fff; font-size: .94rem; letter-spacing: .025em; text-transform: uppercase; }
.infra-v62 .ops-brand small { color: #aaa5a3; }

.infra-v62 .ops-tabs {
    border-color: rgba(255,255,255,.10);
    background: rgba(255,255,255,.07);
}
.infra-v62 .ops-tabs a { color: #c9c2bf; }
.infra-v62 .ops-tabs a:hover { color: #fff; background: rgba(255,255,255,.09); }
.infra-v62 .ops-tabs a.is-active {
    color: #fff;
    background: linear-gradient(135deg, var(--timit-red), var(--timit-red-dark));
    box-shadow: 0 7px 20px rgba(227,27,29,.24);
}

/* Shared cards, controls and status */
.infra-v62 .ops-kicker { color: var(--timit-red-dark); }
.infra-v62 .ops-button {
    border-color: var(--timit-line);
    border-radius: 12px;
    color: var(--timit-black);
    background: #fff;
    box-shadow: 0 1px 0 rgba(255,255,255,.9) inset, 0 4px 14px rgba(35,26,23,.04);
}
.infra-v62 .ops-button:hover:not(:disabled) {
    border-color: #bdb2aa;
    box-shadow: 0 10px 26px rgba(35,26,23,.09);
}
.infra-v62 .ops-button-primary {
    border-color: var(--timit-red-dark);
    color: #fff;
    background: linear-gradient(135deg, var(--timit-red), var(--timit-red-dark));
    box-shadow: 0 10px 26px rgba(227,27,29,.22);
}
.infra-v62 .ops-button-primary:hover:not(:disabled) {
    border-color: #8f0f13;
    box-shadow: 0 13px 32px rgba(227,27,29,.30);
}
.infra-v62 .ops-button-quiet { background: #f7f2ec; }
.infra-v62 .ops-link-button { color: var(--timit-red-dark); }

.infra-v62 .ops-status-pill.is-running,
.infra-v62 .ops-status-pill.is-starting { color: var(--timit-red-dark); background: var(--timit-red-soft); }

.infra-v62 input:not([type="checkbox"]):not([type="radio"]),
.infra-v62 select,
.infra-v62 textarea {
    border-color: #d8d0c8 !important;
    color: #29272a !important;
    background: #fffefa !important;
    box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
}
.infra-v62 input:not([type="checkbox"]):not([type="radio"]):focus,
.infra-v62 select:focus,
.infra-v62 textarea:focus {
    border-color: var(--timit-red) !important;
    box-shadow: 0 0 0 4px rgba(227,27,29,.10) !important;
}
.infra-v62 input[type="checkbox"],
.infra-v62 input[type="radio"] { accent-color: var(--timit-red); }

.infra-v62 :where(.deploy-panel, .deploy-side-card, .transfer-panel, .transfer-sidebar-card, .ops-module-card, .ops-cleanup-card) {
    border-color: var(--timit-line);
    background: var(--timit-card);
    box-shadow: 0 9px 28px rgba(35,26,23,.065);
}

/* Editorial dark heroes */
.infra-v62 :where(.deploy-command-hero, .transfer-hero, .ops-hero) {
    position: relative;
    isolation: isolate;
    border: 1px solid rgba(255,255,255,.08);
    color: #fff;
    background:
        radial-gradient(circle at 100% 0, rgba(227,27,29,.38), transparent 24rem),
        radial-gradient(circle at 0 100%, rgba(227,27,29,.13), transparent 24rem),
        linear-gradient(135deg, #121213, #242124);
    box-shadow: 0 24px 66px rgba(20,13,12,.23);
}
.infra-v62 :where(.deploy-command-hero, .transfer-hero, .ops-hero)::after {
    content: "TIM-IT // CONTROL PLANE";
    position: absolute;
    z-index: -1;
    right: 22px;
    bottom: 15px;
    color: rgba(255,255,255,.09);
    font: 900 .66rem/1 Inter, system-ui, sans-serif;
    letter-spacing: .19em;
}
.infra-v62 :where(.deploy-command-hero, .transfer-hero, .ops-hero) :where(h1,h2,h3,strong) { color: #fff; }
.infra-v62 :where(.deploy-command-hero, .transfer-hero, .ops-hero) p { color: #d7cfcb; }
.infra-v62 :where(.deploy-command-hero, .transfer-hero, .ops-hero) .ops-kicker { color: #ff7779; }

.infra-v62 .deploy-next-action,
.infra-v62 .transfer-next-card,
.infra-v62 .ops-next-box {
    border-color: rgba(255,255,255,.13);
    background: rgba(255,255,255,.085);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}
.infra-v62 :where(.deploy-next-action, .transfer-next-card, .ops-next-box) :where(h2,strong,p,small,span) { color: #fff; }

.infra-v62 .deploy-hero-metrics article,
.infra-v62 .ops-mini-metrics,
.infra-v62 .transfer-summary article {
    border-color: rgba(255,255,255,.10);
    background: rgba(255,255,255,.07);
}
.infra-v62 .deploy-hero-metrics :where(small,strong),
.infra-v62 .ops-mini-metrics :where(span,strong),
.infra-v62 .transfer-summary :where(small,strong,span) { color: #fff; }
.infra-v62 .deploy-metric-icon,
.infra-v62 .ops-module-icon,
.infra-v62 .transfer-connection-icon {
    color: #fff;
    background: linear-gradient(135deg, var(--timit-red), var(--timit-red-dark));
    box-shadow: 0 9px 22px rgba(227,27,29,.22);
}

/* Navigation rails and current-step emphasis */
.infra-v62 :where(.deploy-phase-rail, .transfer-stepper) {
    border-color: var(--timit-line);
    background: rgba(255,253,249,.94);
    box-shadow: 0 10px 30px rgba(35,26,23,.07);
}
.infra-v62 :where(.deploy-phase-rail a.is-current, .transfer-stepper a.is-current) {
    border-color: rgba(227,27,29,.35);
    background: linear-gradient(135deg, #fff8f6, #fff0ef);
    box-shadow: inset 3px 0 var(--timit-red);
}
.infra-v62 :where(.deploy-phase-number, .transfer-stepper a > span, .deploy-section-number, .deploy-runbook-number) {
    border-color: #ddd3ca;
    color: #6f6969;
    background: #f4eee7;
}
.infra-v62 :where(.is-current .deploy-phase-number, .transfer-stepper a.is-current > span, .is-current .deploy-runbook-number) {
    border-color: var(--timit-red-dark);
    color: #fff;
    background: linear-gradient(135deg, var(--timit-red), var(--timit-red-dark));
}
.infra-v62 :where(.is-ready .deploy-phase-number, .transfer-stepper a.is-ready > span, .is-ready .deploy-runbook-number) {
    border-color: #9bcdb7;
    color: var(--timit-success);
    background: var(--timit-success-soft);
}

/* Focus, guidance and problem solving */
.infra-v62 .deploy-focus-card,
.infra-v62 .transfer-guidance,
.infra-v62 .deploy-guidance-box {
    border-color: #eadbd0;
    border-left: 4px solid var(--timit-red);
    background: linear-gradient(135deg, #fffdf9, #fbf5ef);
    box-shadow: 0 11px 32px rgba(35,26,23,.07);
}
.infra-v62 .deploy-focus-marker,
.infra-v62 .deploy-guidance-icon {
    color: #fff;
    background: linear-gradient(135deg, var(--timit-red), var(--timit-red-dark));
    box-shadow: 0 9px 24px rgba(227,27,29,.22);
}
.infra-v62 .deploy-needed-action,
.infra-v62 .transfer-message-list.is-warning {
    border-color: #e5c28b;
    background: var(--timit-warning-soft);
}
.infra-v62 .deploy-success-banner,
.infra-v62 .transfer-message-list.is-success {
    border-color: #a9d4c0;
    background: var(--timit-success-soft);
}
.infra-v62 .deploy-issue,
.infra-v62 .transfer-job-error {
    border-color: #e6adb7;
    background: linear-gradient(135deg, #fff9f9, var(--timit-danger-soft));
}
.infra-v62 .deploy-issue.is-warning { border-color: #e5c28b; background: var(--timit-warning-soft); }

/* Server, connection and resource cards */
.infra-v62 :where(.deploy-server-overview article, .deploy-server-card, .deploy-access-status article, .transfer-connection, .transfer-resource, .transfer-plan-card) {
    border-color: var(--timit-line);
    background: #fffefa;
    box-shadow: 0 5px 18px rgba(35,26,23,.045);
}
.infra-v62 :where(.deploy-server-overview article, .transfer-connection, .transfer-resource) { transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease; }
.infra-v62 :where(.deploy-server-overview article, .transfer-connection, .transfer-resource):hover {
    transform: translateY(-2px);
    border-color: #cfc2b8;
    box-shadow: 0 12px 30px rgba(35,26,23,.09);
}
.infra-v62 .transfer-connection.is-selected {
    border-color: rgba(227,27,29,.55);
    background: linear-gradient(135deg, #fffdf9, #fff2ef);
    box-shadow: inset 4px 0 var(--timit-red), 0 12px 30px rgba(35,26,23,.08);
}
.infra-v62 .transfer-resource.is-unknown {
    border-color: #dfae7a;
    background: #fff8ec;
    box-shadow: inset 4px 0 #c77619;
}
.infra-v62 .deploy-server-icon,
.infra-v62 .deploy-server-card-head > span,
.infra-v62 .deploy-status-symbol {
    color: #fff;
    background: linear-gradient(135deg, #2b292b, #111112);
}
.infra-v62 .is-ready > .deploy-status-symbol { color: #fff; background: linear-gradient(135deg, #19825c, #0e6042); }

/* Forms, disclosure panels and tables */
.infra-v62 :where(.deploy-config-editor, .deploy-advanced, .deploy-technical-details, .deploy-maintenance-box, .deploy-files-card, .transfer-add-connection, .transfer-resource-edit) {
    border-color: var(--timit-line);
    background: #fbf7f2;
}
.infra-v62 :where(.deploy-config-editor, .deploy-advanced, .deploy-technical-details, .deploy-maintenance-box, .deploy-files-card, .transfer-add-connection, .transfer-resource-edit) > summary {
    color: #29272a;
    background: #f8f3ed;
}
.infra-v62 .deploy-form-section {
    border-color: var(--timit-line);
    background: #fffefa;
}
.infra-v62 .deploy-choice-grid label,
.infra-v62 .transfer-plan-options label {
    border-color: var(--timit-line);
    background: #fffefa;
}

.infra-v62 table { border-color: var(--timit-line); background: var(--timit-card); }
.infra-v62 th {
    color: #fff;
    background: linear-gradient(135deg, #1a191a, #292629);
}
.infra-v62 td { border-color: #eee7df; }
.infra-v62 tbody tr:hover td { background: #fff8f4; }

/* Monitoring and output */
.infra-v62 .deploy-monitor-tabs {
    border-color: var(--timit-line);
    background: #eee7df;
}
.infra-v62 .deploy-monitor-tabs button.is-active {
    color: #fff;
    background: linear-gradient(135deg, var(--timit-red), var(--timit-red-dark));
    box-shadow: 0 7px 18px rgba(227,27,29,.20);
}
.infra-v62 .deploy-terminal {
    border-color: #373337;
    color: #e9e2dc;
    background:
        linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
        #101011;
    background-size: 100% 24px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 18px 44px rgba(20,13,12,.18);
}
.infra-v62 .deploy-terminal-toolbar {
    border-color: #373337;
    color: #d7cfcb;
    background: #1b191b;
}
.infra-v62 .deploy-job-progress-track,
.infra-v62 .transfer-job-progress,
.infra-v62 .ops-progress-track { background: #e8e0d8; }
.infra-v62 .deploy-job-progress-track i,
.infra-v62 .transfer-job-progress i,
.infra-v62 .ops-progress-track i {
    background: linear-gradient(90deg, var(--timit-red), #ff5a5d);
    box-shadow: 0 0 18px rgba(227,27,29,.24);
}

/* Tim-IT branded legacy fallback pages */
body.infra-v62-legacy {
    background: var(--timit-paper) !important;
}
body.infra-v62-legacy main {
    color: #29272a;
    background:
        radial-gradient(circle at 100% 0, rgba(227,27,29,.06), transparent 24rem),
        var(--timit-paper) !important;
}
body.infra-v62-legacy main :where(.card, .panel, section, article) {
    border-color: var(--timit-line) !important;
    border-radius: 18px !important;
    background: var(--timit-card) !important;
    box-shadow: 0 8px 26px rgba(35,26,23,.065) !important;
}
body.infra-v62-legacy main :where(.btn-primary, button[type="submit"], input[type="submit"]) {
    border-color: var(--timit-red-dark) !important;
    color: #fff !important;
    background: linear-gradient(135deg, var(--timit-red), var(--timit-red-dark)) !important;
}
body.infra-v62-legacy main :where(table thead, table th) {
    color: #fff !important;
    background: #1a191a !important;
}
body.infra-v62-legacy main a { color: var(--timit-red-dark); }

/* Better information hierarchy and breathing room */
.infra-v62 :where(.deploy-panel-head, .transfer-panel-head, .deploy-side-head) {
    border-bottom-color: #eee6de;
}
.infra-v62 .deploy-panel-head h2,
.infra-v62 .transfer-panel-head h2,
.infra-v62 .ops-module-heading h2 { font-size: clamp(1.35rem, 2.1vw, 1.85rem); }
.infra-v62 .deploy-command-hero h1,
.infra-v62 .transfer-hero h1,
.infra-v62 .ops-hero h1 { font-size: clamp(2.15rem, 4vw, 3.65rem); }

@media (max-width: 760px) {
    .infra-v62 .ops-topbar { position: relative; top: 0; align-items: flex-start; }
    .infra-v62 .ops-brand { min-width: 0; }
    .infra-v62 .ops-brand-mark { width: 78px; flex-basis: 78px; }
    .infra-v62 :where(.deploy-command-hero, .transfer-hero, .ops-hero)::after { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .infra-v62 *, .infra-v62 *::before, .infra-v62 *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}