/**
 * Plain CSS (no Node/Vite required) — Apache/PHP can serve this from /public/css/.
 * Linked after the Vite bundle when present; still useful if only this file is available.
 */

[x-cloak] {
    display: none !important;
}

/* Default list indent — Tailwind Preflight resets padding; this layer loads after the bundle in the layout */
ol,
ul,
menu {
    padding-inline-start: 10px;
}

/* Root sidebar list: no extra inset (only nested submenus indent) */
aside nav > ul {
    margin: 0;
    padding-inline-start: 0;
    list-style: none;
}

/* Submenu lists: indent is on each li (pl-[2.5em] in layout), not the nested ul */
aside nav li > ul {
    margin: 0;
    padding-inline-start: 0;
    list-style: none;
}

/*
 * Submenu link rows — 2.5em inset per item.
 * Tailwind arbitrary classes (e.g. pl-[2.5em]) only exist in the Vite bundle after a fresh build;
 * this rule loads from /public/css/ every time so indentation always applies.
 */
aside nav ul[id^='nav-submenu-'] > li,
aside nav #nav-submenu-entries > li {
    padding-inline-start: 2.5em;
}

/* Gmail-style collapsed desktop rail: icons only, labels/submenus hidden */
@media (min-width: 1024px) {
    aside.app-sidebar.sidebar-rail {
        width: 4.25rem;
    }

    aside.app-sidebar.sidebar-rail .sidebar-brand {
        display: flex;
        width: 100%;
        align-items: center;
        justify-content: center;
    }

    aside.app-sidebar.sidebar-rail .sidebar-brand-text {
        display: none;
    }

    aside.app-sidebar.sidebar-rail .sidebar-brand-mark {
        display: inline-flex !important;
        height: 2rem;
        width: 2rem;
        align-items: center;
        justify-content: center;
        border-radius: 0.5rem;
        background: rgb(30 41 59);
        font-size: 0.875rem;
        font-weight: 700;
        line-height: 1;
    }

    aside.app-sidebar.sidebar-rail .sidebar-close {
        display: none !important;
    }

    aside.app-sidebar.sidebar-rail nav {
        padding-left: 0.375rem;
        padding-right: 0.375rem;
    }

    aside.app-sidebar.sidebar-rail nav a,
    aside.app-sidebar.sidebar-rail nav button {
        justify-content: center;
        padding-left: 0.625rem;
        padding-right: 0.625rem;
    }

    aside.app-sidebar.sidebar-rail nav a span,
    aside.app-sidebar.sidebar-rail nav button span,
    aside.app-sidebar.sidebar-rail nav button > svg:not(:first-of-type) {
        display: none;
    }

    aside.app-sidebar.sidebar-rail {
        position: relative;
        z-index: 40;
    }

    aside.app-sidebar {
        transition: width 150ms ease-out;
    }

    aside.app-sidebar.sidebar-rail nav ul[id^='nav-submenu-'],
    aside.app-sidebar.sidebar-rail nav #nav-submenu-entries {
        display: none !important;
    }
}

/* Keep drawer above sticky page chrome on small screens */
@media (max-width: 1023px) {
    aside.app-sidebar {
        width: min(16rem, 85vw);
        max-width: 20rem;
        box-shadow: 0 10px 30px rgba(15, 23, 42, 0.35);
    }
}
@media (min-width: 1024px) {
    aside.app-sidebar.sidebar-rail {
        position: relative;
        z-index: 40;
    }
    aside.app-sidebar {
        transition: width 150ms ease-out;
    }
}

.table-scroll {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.table-scroll > table {
    width: 100%;
    min-width: max-content;
    border-collapse: collapse;
}

.table-scroll th,
.table-scroll td {
    vertical-align: middle;
}

.table-scroll th {
    white-space: nowrap;
}

.table-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    white-space: nowrap;
}

/* Daybook entry — dense, above-the-fold layout */
.daybook-entry-form {
    --entry-field-gap: 0.5rem;
}

.daybook-entry-form .entry-field + .entry-field {
    margin-top: 0;
}

.daybook-entry-form [x-data='searchableSelect'] ul {
    font-size: 0.8125rem;
}

.daybook-entry-form [x-data='searchableSelect'] ul button {
    padding: 0.375rem 0.5rem;
}

.daybook-entry-form details > summary {
    list-style: none;
}

.daybook-entry-form details > summary::-webkit-details-marker {
    display: none;
}

.daybook-entry-form details > summary::before {
    content: '▸ ';
    display: inline-block;
    transition: transform 0.15s ease;
}

.daybook-entry-form details[open] > summary::before {
    transform: rotate(90deg);
}

.narration-final-textarea {
    display: block;
    width: 100%;
    min-height: 5.5rem;
    max-height: 10rem;
    overflow-y: scroll;
    resize: vertical;
    scrollbar-gutter: stable;
}

.narration-final-textarea::-webkit-scrollbar {
    width: 10px;
}

.narration-final-textarea::-webkit-scrollbar-track {
    background: #f1f5f9;
    border-radius: 4px;
}

.narration-final-textarea::-webkit-scrollbar-thumb {
    background: #94a3b8;
    border-radius: 4px;
}

.narration-final-textarea::-webkit-scrollbar-thumb:hover {
    background: #64748b;
}
