﻿:root {
    --wo-navy: #0f172a;
    --wo-blue: #2563eb;
    --wo-bg: #f5f7fb;
    --wo-muted: #64748b;
    --wo-card: #fff
}

* {
    box-sizing: border-box
}

body {
    margin: 0;
    background: var(--wo-bg);
    color: #1e293b;
    font-family: Inter,Segoe UI,Arial,sans-serif
}

.app-shell {
    min-height: 100vh
}

.sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    width: 250px;
    background: linear-gradient(180deg, #0f172a, #172554);
    padding: 22px 16px;
    z-index: 1000;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,.18) transparent;
}

    .sidebar::-webkit-scrollbar {
        width: 5px;
    }

    .sidebar::-webkit-scrollbar-track {
        background: transparent;
    }

    .sidebar::-webkit-scrollbar-thumb {
        background: rgba(255,255,255,.18);
        border-radius: 10px;
    }

        .sidebar::-webkit-scrollbar-thumb:hover {
            background: rgba(255,255,255,.30);
        }

.brand {
    display: flex;
    gap: 12px;
    align-items: center;
    color: white;
    margin: 0 8px 28px
}

.brand-mark {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: #3b82f6;
    display: grid;
    place-items: center;
    font-weight: 800;
    font-size: 22px
}

.brand strong {
    display: block;
    font-size: 20px
}
.nav-subtitle {
    margin: 10px 8px 3px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .08em;
    color: rgba(255,255,255,.32);
    text-transform: uppercase;
}
.brand small {
    display: block;
    color: #94a3b8;
    font-size: 11px
}
.btn-light {
    background: #e7e7e7;
}
.form-check-input[type=radio] {
    border-radius: 50%;
    border: 2px solid black;
}
.sidebar .nav-link {
    color: #cbd5e1;
    border-radius: 10px;
    padding: 10px 12px;
    margin: 2px 0
}

    .sidebar .nav-link:hover {
        background: #ffffff12;
        color: white
    }

    .sidebar .nav-link i {
        width: 24px
    }

.nav-label {
    font-size: 10px;
    letter-spacing: .12em;
    color: #64748b;
    margin: 18px 12px 7px
}

.sidebar-footer {
    margin-top: auto;
    padding: 12px
}

    .sidebar-footer a {
        color: #93c5fd;
        text-decoration: none
    }

.main {
    margin-left: 250px;
    min-height: 100vh
}

.topbar {
    height: 68px;
    background: white;
    border-bottom: 1px solid #e2e8f0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 15px;
    position: sticky;
    top: 0;
    z-index: 100
}

.content {
    padding: 28px
}

.page-title {
    font-weight: 750;
    margin: 0
}

.card {
    border: 0;
    border-radius: 14px;
    box-shadow: 0 1px 3px #0f172a12
}

.stat-card .icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: #eff6ff;
    color: #2563eb;
    font-size: 20px
}

.stat-value {
    font-size: 25px;
    font-weight: 750
}

.table > thead th {
    font-size: 12px;
    text-transform: uppercase;
    color: #64748b;
    font-weight: 650;
    background: #f8fafc
}

.btn-primary {
    background: #2563eb;
    border-color: #2563eb
}

.form-label {
    font-size: 13px;
    font-weight: 600;
    color: #475569
}

.section-title {
    font-size: 14px;
    font-weight: 700;
    color: #334155;
    border-bottom: 1px solid #e2e8f0;
    padding-bottom: 10px;
    margin-bottom: 16px
}

.login-page {
    min-height: 100vh;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg,#0f172a,#1e3a8a)
}

.login-card {
    width: min(430px,92vw);
    padding: 34px;
    border-radius: 20px;
    background: white;
    box-shadow: 0 24px 80px #0005
}

.money {
    font-variant-numeric: tabular-nums
}

@media(max-width:991px) {
    .sidebar {
        transform: translateX(-100%);
        transition: .2s
    }

        .sidebar.open {
            transform: none
        }

    .main {
        margin-left: 0
    }

    .content {
        padding: 18px
    }
}

#menuBtn {
    padding: 0
}

    #menuBtn .bi-list {
        font-size: 17px
    }

.page-title {
    font-size: 24px !important;
}

.text-secondary {
    font-size: 14px;
}
/* WeOrvia v9: readable controls, filters and compact mobile layout. */
.form-label { color:#171717; }
.form-control,.form-select { border-color:#c5c5c5; border-width:1.5px; }
.form-control:focus,.form-select:focus { border-color:#2563eb; box-shadow:0 0 0 .16rem #2563eb24; }
.filter-form { display:flex!important; flex-wrap:wrap!important; align-items:end; gap:12px!important; margin-left:0!important; margin-right:0!important; }
.filter-form > .filter-field,.filter-form > [class*="col"] { flex:1 1 190px; width:auto!important; max-width:100%; padding:0; margin-top:0!important; }
.filter-form > input,.filter-form > select { flex:1 1 230px; width:auto; }
.filter-form > button,.filter-form > a { flex:0 0 auto; }
.filter-form label { font-size:.83rem; margin-bottom:5px; }
.article-search-box { position:sticky; top:var(--wo-header-height,76px); z-index:1010; background:#fff; padding:12px; border:1px solid #c5c5c5; border-radius:12px; box-shadow:0 6px 16px #0f172a14; }
#articleResults .list-group-item { color:#17233d; background:#fff; border:1px solid #c5c5c5; padding:12px 14px; line-height:1.5; text-align:left; white-space:normal; overflow-wrap:anywhere; }
#articleResults .list-group-item:hover,#articleResults .list-group-item:focus,#articleResults .list-group-item[aria-selected="true"] { background:#e7f0ff; color:#123c82; border-color:#2563eb; }
#articleResults { box-shadow:0 8px 20px #0f172a20; max-height:min(320px,40vh)!important; }
.document-actions { min-width:190px; }
.document-more { min-width:0; max-width:330px; }
.document-more[open] { flex-basis:100%; }
.document-more summary { list-style:none; }
.document-more summary::-webkit-details-marker { display:none; }
.document-more form { max-width:100%; }
.document-more select { min-width:140px; width:auto; }
.scroll-hint { display:block; font-size:.8rem; color:#34455e; padding:6px 4px; }
.table-responsive { -webkit-overflow-scrolling:touch; overscroll-behavior-x:contain; }
.table-responsive.is-overflowing { box-shadow:inset -10px 0 8px -10px #122c54; }
.stock-result { border:1px solid #c5c5c5; border-radius:9px; padding:10px; margin-top:8px; }
@media(max-width:767px) {
 .content { padding:10px 8px!important; }
 .topbar { padding:10px 8px!important; gap:8px; flex-wrap:wrap; }
 .topbar .badge { white-space:normal; }
 .main { min-width:0; }
 .content .card.p-3,.content .card.p-4 { padding:0!important; }
 .content .card.p-3 > :not(.table-responsive),.content .card.p-4 > :not(.table-responsive) { margin-left:8px; margin-right:8px; }
 .content .card.p-3 > :first-child,.content .card.p-4 > :first-child { margin-top:10px; }
 .content .card.p-3 > :last-child,.content .card.p-4 > :last-child { margin-bottom:10px; }
 .content .card .card-body { padding:10px 8px; }
 .content .row { --bs-gutter-x:12px; }
 .filter-form > .filter-field,.filter-form > [class*="col"],.filter-form > input,.filter-form > select { flex-basis:100%; }
 .form-control,.form-select { min-height:42px; font-size:16px; }
 .btn { min-height:38px; }
 .page-title { font-size:1.45rem; }
 .content > .d-flex { flex-wrap:wrap; gap:10px; }
 .article-search-box { padding:9px; top:var(--wo-header-height,76px); }
 #formDocumento { padding-bottom:200px; }
 .invoice-cart { display:grid!important; grid-template-columns:minmax(0,1fr) auto; justify-content:stretch!important; align-items:center!important; gap:6px 10px!important; padding:10px max(10px,env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left))!important; }
 .invoice-cart details { grid-column:1/-1; margin:0!important; min-width:0; }
 .invoice-cart > div:not(#cartError) { min-width:0; }
 .invoice-cart strong { font-size:1.25rem!important; line-height:1.3; }
 .invoice-cart > button { white-space:normal; max-width:135px; }
 .invoice-cart #cartError { grid-column:1/-1; }
 .invoice-cart-details { max-height:22vh!important; }
 .usage-summary .card { min-height:110px; }
 .sidebar.open { z-index:1050; }
}
.text-bg-light {
    color: #000 !important;
    background-color: rgb(220 227 233) !important;
}
[hidden] { display:none!important; }

.catalogo-dialog{width:min(1100px,96vw);max-height:92vh;border:1px solid #c5c5c5;border-radius:12px;padding:20px}.catalogo-dialog::backdrop{background:#0007}.catalogo-dialog>button{float:right;position:sticky;top:0}.selection-toolbar{position:sticky;top:0;z-index:5;background:#fff;border:1px solid #c5c5c5;padding:12px;margin-bottom:12px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}@media(max-width:576px){.catalogo-dialog{padding:10px;width:98vw}.selection-toolbar{position:static}}
