/* =============================================================================
   Era Layout Overrides
   ADR-0119 Extension: Deep Immersion Layouts

   These overrides force structural changes to standard UI components (AppCard,
   Sidebar, etc.) to match the physical properties of the era (e.g. paper ledgers
   vs CRT screens vs Modern glass).
   ============================================================================= */

/* -----------------------------------------------------------------------------
   Victorian / Gilded Age (Era I & II)
   Concept: Physical Paper & Ink / Ledgers / Official Documents
   Characteristic: Sharp corners, double borders, dense text, no shadows.
   ----------------------------------------------------------------------------- */

body.theme-victorian,
body.theme-gilded,
body.theme-pioneer {

    /* 1. Kill all rounded corners globally */
    .rounded-xl,
    .rounded-lg,
    .rounded-md,
    .rounded-sm,
    .rounded {
        border-radius: 0 !important;
    }

    /* 2. Remove modern shadows & glass effects */
    .shadow-xl,
    .shadow-lg,
    .shadow-md,
    .backdrop-blur-md {
        box-shadow: none !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    /* 3. AppCard Transformation: Ledger Box */
    .e-card {
        background: transparent !important;
        border: 2px solid var(--text-primary) !important;
        position: relative;
        overflow: visible !important;
    }

    /* Decorative corners for cards */
    .e-card::before,
    .e-card::after {
        content: "";
        position: absolute;
        width: 10px;
        height: 10px;
        border: 2px solid var(--text-primary);
        transition: all 0.3s ease;
    }

    .e-card::before {
        top: -4px;
        left: -4px;
        border-right: none;
        border-bottom: none;
    }

    .e-card::after {
        bottom: -4px;
        right: -4px;
        border-left: none;
        border-top: none;
    }

    /* 4. Telegraph Layout Override */
    .telegraph-layout {
        /* Simulate a book or ledger */
        background-color: var(--surface-secondary);
        padding: 20px;
    }

    .telegraph-sidebar {
        border-right: 3px double var(--text-primary) !important;
        background-color: var(--surface-primary) !important;
    }

    .telegraph-content {
        padding-left: 20px;
        background-color: var(--surface-base) !important;
        border-left: 1px solid rgba(0, 0, 0, 0.1);
        /* Page gutter shadow */
    }
}

/* -----------------------------------------------------------------------------
   Terminal / Computer Age (Era V)
   Concept: Phosphor Screen / Grid
   Characteristic: Blocky, grid-lines, monospaced layout.
   ----------------------------------------------------------------------------- */

body.theme-terminal {

    /* 1. Kill rounded corners */
    .rounded-xl,
    .rounded-lg,
    .rounded {
        border-radius: 0 !important;
    }

    /* 2. Flatten depth */
    .shadow-xl,
    .shadow-lg {
        box-shadow: none !important;
    }

    /* 3. AppCard Transformation: Data Block */
    .e-card {
        background-color: black !important;
        border: 1px solid var(--terminal-green-dim) !important;
    }

    /* Header styling */
    .e-card .border-b {
        border-bottom: 1px dashed var(--terminal-green-dim) !important;
    }
}

/* -----------------------------------------------------------------------------
   Windows 9x (Era VI)
   Concept: Beveled GUI
   Characteristic: 3D Bevels (inset/outset), gray backgrounds.
   ----------------------------------------------------------------------------- */

body.theme-win98,
body.theme-winxp {

    /* 1. Sharp corners for standard windows */
    .rounded-xl,
    .rounded-2xl {
        border-radius: 2px !important;
    }

    /* 2. Classic 3D Bevels */
    .e-card {
        border: 2px solid #dfdfdf !important;
        border-top-color: #fff !important;
        border-right-color: #404040 !important;
        border-bottom-color: #404040 !important;
        border-left-color: #fff !important;
        background: #c0c0c0 !important;
        /* Win98 Gray */
        box-shadow: 1px 1px 0px black !important;
    }

    /* Input fields inset */
    input,
    textarea,
    .bg-surface-secondary {
        border: 2px solid #dfdfdf !important;
        border-top-color: #404040 !important;
        border-left-color: #404040 !important;
        border-right-color: #fff !important;
        border-bottom-color: #fff !important;
        background: white !important;
    }
}