/**
 * SESSIONVAULT - BASE CSS
 * --------------------------------------------------------
 * TABLE OF CONTENTS:
 * --------------------------------------------------------
 * 1. CSS Variables & Theme
 * 2. Global Resets
 * 3. Body & App Shell
 * 4. Animations & Utilities
 * 5. Print Mode Styles
 * ========================================================
 */

/* ======================================================== */
/* 1. CSS VARIABLES & THEME                                 */
/* ======================================================== */
:root {
    --bg-app: #f8fafc;
    --sidebar-bg: #0f172a;
    --sidebar-text: #94a3b8;
    --sidebar-hover: #1e293b;
    --panel-bg: #ffffff;
    --text-main: #0f172a;
    --text-muted: #64748b;
    --border: #e2e8f0;
    --accent: #2563eb;
    --accent-hover: #1d4ed8;
    --success: #16a34a;
    --warning: #ea580c;
    --danger: #ef4444;
    --danger-hover: #dc2626;
    --charcoal: #475569;
}

/* ======================================================== */
/* 2. GLOBAL RESETS                                         */
/* ======================================================== */
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-family: 'Inter', sans-serif;
}

/* ======================================================== */
/* 3. BODY & APP SHELL                                      */
/* ======================================================== */
body {
    background-color: var(--bg-app);
    color: var(--text-main);
    position: absolute;
    /* 'inset' automatically handles top/bottom/left/right for both LTR and RTL */
    inset: 0;
    overflow: hidden;
}

/* ======================================================== */
/* 4. ANIMATIONS & UTILITIES                                */
/* ======================================================== */
@keyframes spin-anim {
    100% {
        transform: rotate(360deg);
    }
}

.spinning {
    animation: spin-anim 1s linear infinite;
    transform-origin: center;
}

.static-version-footer {
    position: fixed !important;
    bottom: 16px !important;
    /* Logical property to stick to the start side regardless of language direction */
    inset-inline-start: 0 !important;
    width: 100vw !important;
    text-align: center !important;
    color: #94a3b8 !important;
    font-size: 0.85rem !important;
    z-index: 1010 !important;
    pointer-events: none !important;
}

/* ======================================================== */
/* 5. PRINT MODE STYLES                                     */
/* ======================================================== */
#print-isolated-target {
    display: none;
}

@media print {
    body>* {
        display: none !important;
    }

    body>#print-isolated-target {
        display: block !important;
    }

    body {
        background: white !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    #print-isolated-target {
        position: static !important;
        width: 100%;
        padding: 0;
        background: white;
        color: black;
        page-break-inside: avoid;
    }

    .btn,
    select,
    textarea,
    input,
    .sidebar,
    .top-bar {
        display: none !important;
    }

    @page {
        size: portrait;
        margin: 15mm;
    }
}