/**
 * Hexidecimate Character Sheet - Print Styles
 * Dense black-and-white tabletop sheet layout for A4/Letter printing.
 */

@media print {
    @page {
        size: A4;
        margin: 8mm;
    }

    * {
        box-shadow: none !important;
        text-shadow: none !important;
        -webkit-print-color-adjust: economy !important;
        print-color-adjust: economy !important;
    }

    html,
    body {
        background: #fff !important;
        color: #000 !important;
        font-family: Georgia, "Times New Roman", serif !important;
        font-size: 7.3pt;
        line-height: 1.14;
        margin: 0;
        padding: 0;
    }

    body::before {
        content: "HEXIDECIMATE CHARACTER RECORD";
        display: block;
        border-bottom: 3px double #000;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 7.5pt;
        font-weight: 800;
        letter-spacing: 0.08em;
        margin-bottom: 3mm;
        padding-bottom: 1.5mm;
        text-align: center;
    }

    a {
        color: #000 !important;
        text-decoration: none !important;
    }

    header,
    nav,
    .app-header,
    #view-roster,
    #view-party,
    #view-session,
    #view-combat,
    #view-create,
    #view-magic,
    #sheet-empty,
    .hero-actions,
    .level-up-panel,
    .inline-actions,
    .panel-header select,
    .panel-header button,
    button,
    .btn-primary,
    .btn-secondary,
    .inventory-actions,
    .search-filter,
    .modal,
    .notification,
    footer,
    .hidden {
        display: none !important;
    }

    .screen-only,
    .identity-player,
    .identity-campaign,
    .identity-status {
        display: none !important;
    }

    .print-only {
        display: inline !important;
    }

    #app,
    .main-content,
    #view-sheet,
    #sheet-content {
        display: block !important;
        background: #fff !important;
        color: #000 !important;
        margin: 0 !important;
        max-width: none !important;
        padding: 0 !important;
        width: 100% !important;
    }

    .sheet-layout {
        display: grid !important;
        grid-template-columns: 1fr 1fr;
        gap: 2.25mm;
        align-items: start;
    }

    .panel,
    .empty-state,
    .sheet-hero,
    .combat-card,
    .rule-card,
    .rule-row,
    details {
        background: #fff !important;
        border: 1px solid #000 !important;
        border-radius: 0 !important;
        color: #000 !important;
    }

    .panel {
        break-inside: avoid;
        margin: 0 0 2.25mm !important;
        padding: 2mm !important;
    }

    .sheet-hero,
    .combat-panel {
        grid-column: 1 / -1;
    }

    .sheet-hero {
        display: grid !important;
        grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.35fr);
        gap: 2.25mm;
        padding: 2.5mm !important;
    }

    .sheet-name {
        border: 0 !important;
        border-bottom: 2px solid #000 !important;
        color: #000 !important;
        display: block;
        font-family: Georgia, "Times New Roman", serif !important;
        font-size: 17pt !important;
        font-weight: 800;
        line-height: 1;
        margin: 0 0 1.5mm !important;
        padding: 0 0 0.7mm !important;
        width: 100%;
    }

    .hero-identity p,
    .muted,
    .rule-card p,
    .combat-card p {
        color: #000 !important;
    }

    .hero-identity p {
        margin: 0 0 0.7mm !important;
    }

    .identity-grid {
        display: grid !important;
        grid-template-columns: 1fr;
        gap: 1mm;
        margin-top: 1.5mm;
    }

    .identity-grid label,
    .level-zero-class {
        border: 1px solid #000;
        color: #000 !important;
        display: grid;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 5.6pt;
        font-weight: 800;
        gap: 0.35mm;
        letter-spacing: 0.04em;
        padding: 0.9mm;
        text-transform: uppercase;
    }

    input,
    select,
    textarea {
        appearance: none;
        background: transparent !important;
        border: 0 !important;
        color: #000 !important;
        font-family: Georgia, "Times New Roman", serif !important;
        font-size: 7.3pt !important;
        padding: 0 !important;
    }

    .summary-grid,
    .stats-grid,
    .equipped-grid,
    .combat-stat-list {
        display: grid !important;
        gap: 0.9mm;
    }

    .summary-grid,
    .stats-grid {
        grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
        margin: 0 0 1.25mm !important;
    }

    .summary-grid div,
    .stat-box,
    .equipped-grid div,
    .combat-stat-list div {
        background: #fff !important;
        border: 1px solid #000 !important;
        border-radius: 0 !important;
        min-height: 7.5mm;
        padding: 0.8mm !important;
        text-align: center;
    }

    .summary-grid span,
    .stat-box span,
    .equipped-grid span,
    .combat-stat-list span {
        color: #000 !important;
        display: block;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 5.2pt !important;
        font-weight: 800;
        letter-spacing: 0.04em;
        line-height: 1;
        text-transform: uppercase;
    }

    .summary-grid strong,
    .stat-box strong,
    .equipped-grid strong,
    .combat-stat-list strong {
        color: #000 !important;
        display: block;
        font-size: 9.5pt !important;
        font-weight: 800;
        line-height: 1.12;
        margin-top: 0.45mm;
        overflow-wrap: anywhere;
    }

    .print-write-condition strong {
        min-height: 4.2mm;
    }

    .panel h3,
    .combat-card h4 {
        background: #000 !important;
        border: 1px solid #000;
        color: #fff !important;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 6.7pt !important;
        font-weight: 800;
        letter-spacing: 0.06em;
        line-height: 1;
        margin: -2mm -2mm 1.6mm !important;
        padding: 0.9mm 1.4mm !important;
        text-transform: uppercase;
    }

    .combat-grid {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 1.6mm;
        margin-top: 0 !important;
    }

    .combat-card {
        break-inside: avoid;
        padding: 2mm !important;
    }

    .combat-card h4 {
        margin: -2mm -2mm 1.2mm !important;
    }

    .combat-stat-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .combat-stat-list div {
        min-height: 6.5mm;
        text-align: left;
    }

    .combat-tooltip {
        border-bottom: 0 !important;
    }

    .combat-tooltip::after {
        content: none !important;
    }

    .rule-list,
    .rule-list.dense {
        display: grid !important;
        gap: 0.9mm;
        max-height: none !important;
        overflow: visible !important;
    }

    .rule-card,
    .rule-row {
        break-inside: avoid;
        display: block !important;
        padding: 1.2mm !important;
    }

    .rule-card h4,
    .rule-row strong,
    .inventory-item strong {
        font-size: 7.4pt;
        margin: 0;
    }

    .rule-card p,
    .rule-row p {
        font-size: 6.4pt;
        margin: 0.55mm 0 0 !important;
    }

    .rank-effects {
        gap: 0.6mm;
        margin-top: 0.8mm;
    }

    .rank-effect-row {
        border-left: 1px solid #000 !important;
        padding-left: 1.4mm !important;
    }

    details {
        padding: 1.2mm !important;
    }

    details:not([open]) {
        display: none !important;
    }

    summary {
        color: #000 !important;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 6.7pt;
        font-weight: 800;
        margin-bottom: 1mm;
        text-transform: uppercase;
    }

    .tabs-lite {
        display: block !important;
    }

    .equipped-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .pill,
    .chip {
        background: #fff !important;
        border: 1px solid #000 !important;
        border-radius: 0 !important;
        color: #000 !important;
        display: inline-block;
        font-size: 6.1pt !important;
        margin: 0 0.6mm 0.6mm 0;
        padding: 0.25mm 0.7mm !important;
    }

    .notes-panel {
        break-inside: avoid;
    }

    .notes-panel textarea {
        border: 1px solid #000 !important;
        min-height: 32mm !important;
        padding: 1.25mm !important;
        width: 100% !important;
        background:
            repeating-linear-gradient(
                to bottom,
                transparent 0,
                transparent 4.7mm,
                #cfcfcf 4.8mm
            ) !important;
    }

    .notes-panel:last-child {
        grid-column: 1 / -1;
    }

    .spell-group h4 {
        border-bottom: 1px solid #000;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 6.8pt;
        margin: 1.2mm 0 0.6mm;
        text-transform: uppercase;
    }

    .spell-group ul {
        columns: 2;
        margin: 0;
        padding-left: 3.5mm;
    }

    .spell-group li {
        break-inside: avoid;
        font-size: 6.7pt;
        margin-bottom: 0.55mm;
    }

    .matrix-grid,
    .matrix-slot-list {
        display: grid !important;
        gap: 0.8mm;
    }

    .matrix-slot,
    .matrix-card {
        background: #fff !important;
        border: 1px solid #000 !important;
        border-radius: 0 !important;
        padding: 0.9mm !important;
    }

    .class-choice-panel,
    .available-only,
    .print-hidden {
        display: none !important;
    }

    /* Inventory should feel writable on paper, not like app cards. */
    .panel:has(.equipped-grid) .rule-list,
    .panel:has(.inventory-add) .rule-list {
        border-top: 1px solid #000;
        display: block !important;
        margin-top: 1.5mm;
    }

    .panel:has(.equipped-grid) .rule-card,
    .panel:has(.inventory-add) .rule-card,
    .panel:has(.equipped-grid) .rule-row,
    .panel:has(.inventory-add) .rule-row {
        border: 0 !important;
        border-bottom: 1px solid #000 !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto;
        min-height: 6mm;
        padding: 1mm 0 !important;
    }

    .panel:has(.inventory-add) .rule-list::after {
        content: "";
        display: block;
        height: 30mm;
        background:
            repeating-linear-gradient(
                to bottom,
                transparent 0,
                transparent 5.8mm,
                #000 5.9mm,
                transparent 6mm
            );
    }

    p {
        orphans: 2;
        widows: 2;
    }
}

@media print and (max-width: 760px) {
    .sheet-layout,
    .sheet-hero,
    .combat-grid {
        grid-template-columns: 1fr !important;
    }
}