:root{
    --orange:#f9ae3b;
    --gold:#fbd16d;
    --soft:#f8de96;
    --gray:#70706f;
    --ink:#292929;
    --bg:#f5f6f7;
    --white:#fff;
    --line:#e7e7e7;
    --danger:#9d2828
}

*{
    box-sizing:border-box
}

html,
body{
    margin:0;
    min-height:100%
}

body{
    font-family:Arial,Helvetica,sans-serif;
    color:var(--ink);
    background:var(--bg);
    line-height:1.55
}

a{
    color:inherit
}

.shell{
    display:flex;
    min-height:100dvh
}

aside{
    width:250px;
    height:100dvh;
    position:sticky;
    top:0;
    align-self:flex-start;
    overflow-y:auto;
    background:white;
    padding:38px 24px;
    display:flex;
    flex-direction:column;
    border-right:1px solid var(--line)
}

.brand{
    text-decoration:none;
    display:block;
    margin-bottom:55px
}

.logo{
    display:block;
    width:100%;
    height:auto
}

.nav-label,
.eyebrow{
    font-size:11px;
    font-weight:700;
    letter-spacing:1.8px
}

.nav-label{
    color:#595959
}

.nav{
    padding:13px 12px;
    display:flex;
    align-items:center;
    gap:12px;
    text-decoration:none;
    border-radius:8px;
    margin:6px 0;
    font-size:14px;
    flex-wrap:wrap
}

.active{
    background:#fff1d7;
    font-weight:bold
}

.muted{
    color:#626262
}

.nav span{
    font-size:10px;
    margin-left:auto
}

.aside-foot{
    margin-top:auto;
    padding-top:60px;
    font-weight:bold
}

.aside-foot small{
    font-size:11px;
    font-weight:normal
}

.workspace{
    flex:1;
    min-width:0
}

header{
    min-height:82px;
    padding:12px 48px;
    background:white;
    border-bottom:1px solid var(--line);
    display:flex;
    align-items:center;
    justify-content:space-between;
    font-size:13px;
    gap:20px
}

.userbar{
    display:flex;
    align-items:center;
    gap:16px
}

.user-meta{
    display:flex;
    flex-direction:column;
    text-align:right;
    line-height:1.3
}

.user-meta span{
    font-size:11px;
    color:#626262
}

.logout-form{
    margin:0
}

main{
    max-width:1200px;
    padding:48px;
    margin:auto
}

.intro{
    background:#fff;
    padding:40px;
    border-radius:15px;
    border-top:5px solid var(--orange)
}

.eyebrow{
    color:#76500d
}

h1{
    font-size:44px;
    line-height:1.12;
    letter-spacing:-1.8px;
    margin:18px 0
}

p{
    color:#555;
    font-size:15px
}

.intro p{
    max-width:650px
}

.button{
    appearance:none;
    border:0;
    cursor:pointer;
    display:inline-flex;
    justify-content:center;
    gap:16px;
    align-items:center;
    background:var(--orange);
    color:var(--ink);
    padding:12px 20px;
    margin-top:14px;
    border-radius:7px;
    text-decoration:none;
    font:inherit;
    font-size:14px;
    font-weight:bold
}

.button:hover{
    background:var(--gold)
}

.button:focus-visible,
a:focus-visible,
input:focus-visible{
    outline:3px solid #292929;
    outline-offset:3px
}

.button-ghost{
    margin:0;
    background:#fff;
    border:1px solid #d6d6d6;
    padding:9px 13px
}

.button-ghost:hover{
    background:#f6f6f6
}

.button-block{
    width:100%;
    margin-top:8px
}

.notice{
    display:flex;
    gap:15px;
    margin:24px 0 36px;
    background:#fff8e9;
    padding:20px 24px;
    border:1px solid #ecd8b1;
    border-radius:10px
}

.notice>.icon{
    flex-shrink:0
}

.notice strong{
    font-size:14px
}

.notice p{
    font-size:13px;
    margin:5px 0 0
}

.section-title{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:18px
}

h2{
    font-size:20px;
    margin:0
}

.section-title span{
    font-size:12px;
    color:#626262
}

.cards{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:18px
}

.card{
    background:white;
    border:1px solid var(--line);
    padding:25px;
    border-radius:12px
}

.card-top{
    display:flex;
    align-items:center;
    justify-content:space-between
}

.tile{
    padding:10px;
    background:#fff1d7;
    border-radius:9px;
    display:flex
}

.number{
    font-size:12px;
    color:#626262
}

.card h3{
    font-size:16px;
    margin:24px 0 8px
}

.card p{
    font-size:13px;
    margin:0
}

.auth-page{
    background:var(--bg);
    min-height:100dvh
}

.auth-shell{
    min-height:100dvh;
    display:grid;
    place-items:center;
    padding:28px
}

.auth-card{
    width:min(460px,100%);
    background:#fff;
    border:1px solid var(--line);
    border-top:5px solid var(--orange);
    border-radius:15px;
    padding:38px;
    box-shadow:0 12px 35px rgba(41,41,41,.06)
}

.auth-logo{
    display:block;
    width:min(300px,100%);
    height:auto;
    margin:0 auto 38px
}

.auth-heading h1{
    font-size:34px;
    margin:12px 0 8px
}

.auth-heading p{
    margin:0 0 25px
}

.auth-form{
    display:grid;
    gap:10px
}

.auth-form label{
    font-size:13px;
    font-weight:bold;
    margin-top:4px
}

.auth-form input{
    width:100%;
    border:1px solid #cfcfcf;
    border-radius:8px;
    padding:12px 13px;
    font:inherit;
    background:#fff
}

.form-alert{
    background:#fff0f0;
    border:1px solid #e1b8b8;
    color:#6e1e1e;
    padding:12px 14px;
    border-radius:8px;
    font-size:13px;
    margin-bottom:18px
}

.auth-help{
    font-size:12px;
    margin:22px 0 0
}

.error{
    max-width:650px;
    padding:12vh 28px 40px;
    margin:auto
}

.error-logo{
    display:block;
    width:min(300px,80%);
    height:auto;
    margin-bottom:45px
}

.error h1{
    font-size:80px;
    margin:8px 0
}

.icon{
    display:block
}

@media(max-width:950px){
    aside{
        width:210px;
        padding:30px 18px
    }

    .brand{
        margin-bottom:40px
    }

    main{
        padding:28px
    }

    header{
        padding:12px 28px
    }

    .cards{
        grid-template-columns:1fr
    }

    .intro{
        padding:28px
    }
}

@media(max-width:620px){
    .shell{
        display:block;
        min-height:100dvh
    }

    aside{
        width:auto;
        height:auto;
        position:static;
        overflow-y:visible;
        padding:18px 22px;
        border-right:0
    }

    .brand{
        margin:0
    }

    .logo{
        max-width:220px
    }

    .nav,
    .nav-label,
    .aside-foot{
        display:none
    }

    header{
        min-height:66px;
        padding:10px 22px;
        align-items:flex-start
    }

    .userbar{
        margin-left:auto
    }

    .user-meta{
        display:none
    }

    .button-ghost{
        font-size:11px;
        padding:8px 10px
    }

    main{
        padding:20px
    }

    .intro{
        padding:25px
    }

    h1{
        font-size:34px
    }

    .section-title{
        display:block
    }

    .section-title span{
        display:block;
        margin-top:6px
    }

    .auth-shell{
        padding:18px
    }

    .auth-card{
        padding:28px 22px
    }

    .auth-logo{
        margin-bottom:28px
    }
}


/* A02 - administración de usuarios */

.flash{
    margin:0 0 22px;
    padding:13px 16px;
    border-radius:9px;
    border:1px solid;
    font-size:13px
}

.flash-success{
    background:#eef8ef;
    border-color:#bfd8c1;
    color:#285b2c
}

.flash-error{
    background:#fff0f0;
    border-color:#e1b8b8;
    color:#6e1e1e
}

.page-heading{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:28px;
    margin-bottom:24px
}

.page-heading h1{
    font-size:38px;
    margin:5px 0 8px;
    letter-spacing:-1.3px
}

.page-heading p{
    margin:0
}

.compact-heading{
    align-items:center
}

.panel{
    background:#fff;
    border:1px solid var(--line);
    border-radius:12px;
    padding:26px
}

.users-panel{
    padding:0;
    overflow:hidden
}

.filterbar{
    padding:22px 24px;
    border-bottom:1px solid var(--line)
}

.filterbar label{
    display:block;
    font-size:12px;
    font-weight:bold;
    margin-bottom:7px
}

.filterbar-row{
    display:flex;
    gap:9px;
    align-items:center
}

.filterbar input[type=search]{
    flex:1;
    min-width:180px;
    border:1px solid #cfcfcf;
    border-radius:8px;
    padding:10px 12px;
    font:inherit
}

.button-compact{
    margin:0;
    padding:10px 15px
}

.table-meta{
    padding:14px 24px;
    font-size:12px;
    color:#626262;
    border-bottom:1px solid var(--line)
}

.table-wrap{
    overflow-x:auto
}

.data-table{
    width:100%;
    border-collapse:collapse;
    font-size:13px
}

.data-table th,
.data-table td{
    padding:15px 18px;
    text-align:left;
    border-bottom:1px solid var(--line);
    vertical-align:middle
}

.data-table th{
    font-size:11px;
    letter-spacing:.6px;
    text-transform:uppercase;
    color:#626262;
    background:#fafafa
}

.data-table tbody tr:last-child td{
    border-bottom:0
}

.cell-subtext{
    display:block;
    color:#626262;
    font-size:11px;
    margin-top:3px
}

.status-badge{
    display:inline-flex;
    padding:4px 9px;
    border-radius:999px;
    font-size:11px;
    font-weight:bold
}

.status-active{
    background:#eaf5eb;
    color:#2d6131
}

.status-inactive{
    background:#f1f1f1;
    color:#626262
}

.actions-col{
    text-align:right!important;
    white-space:nowrap
}

.row-actions{
    display:flex;
    justify-content:flex-end;
    gap:11px;
    align-items:center
}

.row-actions form{
    margin:0
}

.text-link,
.link-button{
    border:0;
    background:none;
    padding:0;
    color:#5b440e;
    text-decoration:underline;
    text-underline-offset:3px;
    font:inherit;
    font-size:12px;
    cursor:pointer
}

.danger-link{
    color:#8b2828
}

.empty-cell{
    text-align:center!important;
    color:#626262;
    padding:35px!important
}

.pagination{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:18px;
    padding:18px 24px;
    border-top:1px solid var(--line);
    font-size:12px
}

.pagination a{
    font-weight:bold
}

.form-panel{
    max-width:850px
}

.narrow-panel{
    max-width:620px
}

.admin-form{
    display:grid;
    gap:20px
}

.form-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px
}

.field{
    display:flex;
    flex-direction:column;
    gap:7px
}

.field-wide{
    grid-column:1/-1
}

.field label{
    font-size:13px;
    font-weight:bold
}

.field input,
.field select{
    width:100%;
    border:1px solid #cfcfcf;
    border-radius:8px;
    padding:11px 12px;
    font:inherit;
    background:#fff;
    color:var(--ink)
}

.field-error{
    margin:0;
    color:#8b2828;
    font-size:12px
}

.form-help{
    margin:0;
    font-size:12px;
    color:#626262
}

.check-row{
    display:flex;
    align-items:center;
    gap:9px;
    font-size:13px
}

.check-row input{
    width:17px;
    height:17px
}

.form-actions{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    padding-top:4px
}

.form-actions .button{
    margin:0
}

.button-danger{
    background:#9d2828;
    color:#fff
}

.button-danger:hover{
    background:#7f1f1f
}

.security-panel{
    max-width:850px;
    margin-top:18px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px
}

.security-panel h2{
    margin-bottom:5px
}

.security-panel p{
    margin:0
}

.security-panel .button{
    margin:0
}

.password-grid{
    padding-top:4px
}

@media(max-width:760px){
    .page-heading{
        display:block
    }

    .page-heading>.button{
        margin-top:18px
    }

    .filterbar-row{
        align-items:stretch;
        flex-wrap:wrap
    }

    .filterbar-row input[type=search]{
        flex-basis:100%
    }

    .form-grid{
        grid-template-columns:1fr
    }

    .field-wide{
        grid-column:auto
    }

    .security-panel{
        display:block
    }

    .security-panel form{
        margin-top:18px
    }

    .row-actions{
        justify-content:flex-start;
        flex-wrap:wrap
    }

    .actions-col{
        text-align:left!important
    }

    .data-table{
        min-width:760px
    }
}


/* A03 - carga y almacenamiento privado de PDF */

.upload-form input[type=file]{
    width:100%;
    border:1px dashed #bdbdbd;
    border-radius:10px;
    padding:18px;
    background:#fafafa;
    font:inherit
}

.upload-form input[type=file]::file-selector-button{
    border:0;
    border-radius:7px;
    background:#fff1d7;
    color:var(--ink);
    padding:10px 14px;
    margin-right:14px;
    font-weight:bold;
    cursor:pointer
}

.documents-table{
    min-width:900px
}


/* A04 - acceso temporal mediante QR */

.action-sep{
    display:inline-block;
    margin:0 7px;
    color:#aaa
}

.access-grid{
    display:grid;
    grid-template-columns:minmax(300px,390px) minmax(0,1fr);
    gap:22px;
    align-items:start
}

.qr-panel{
    text-align:center
}

.qr-box{
    display:grid;
    place-items:center;
    margin:18px auto;
    max-width:320px;
    background:#fff
}

.qr-box svg{
    display:block;
    width:min(100%,300px);
    height:auto
}

.access-state{
    display:inline-flex;
    padding:6px 11px;
    border-radius:999px;
    font-size:12px;
    font-weight:bold
}

.access-state-active{
    background:#eaf5eb;
    color:#2d6131
}

.access-state-expired{
    background:#fff1d7;
    color:#76500d
}

.access-state-revoked{
    background:#fff0f0;
    color:#7a2020
}

.access-dates{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    margin-top:18px
}

.access-dates>div{
    border:1px solid var(--line);
    border-radius:9px;
    padding:12px;
    text-align:left
}

.access-dates strong,
.access-dates span{
    display:block
}

.access-dates strong{
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:.5px
}

.access-dates span{
    font-size:12px;
    color:#555;
    margin-top:3px
}

.access-info-panel h2{
    margin-bottom:12px
}

.public-url{
    border:1px solid var(--line);
    background:#fafafa;
    border-radius:9px;
    padding:13px;
    overflow-wrap:anywhere
}

.public-url code{
    font-size:12px
}

.wrap-actions{
    margin-top:16px
}


/* Página pública del QR */

.public-access-shell{
    min-height:100dvh;
    background:var(--bg);
    padding:26px;
    display:grid;
    place-items:start center
}

.public-access-card{
    width:min(1050px,100%);
    background:#fff;
    border:1px solid var(--line);
    border-top:5px solid var(--orange);
    border-radius:15px;
    padding:30px;
    margin:auto
}

.public-logo{
    display:block;
    width:min(330px,75%);
    height:auto;
    margin:0 auto 28px
}

.public-kicker{
    display:block;
    text-align:center;
    color:#76500d;
    font-size:11px;
    font-weight:700;
    letter-spacing:1.8px
}

.public-access-card h1{
    text-align:center;
    font-size:34px;
    margin:10px 0
}

.public-access-card>p{
    text-align:center
}

.public-reference{
    font-weight:bold;
    color:var(--ink)
}


/* Visor PDF de escritorio */

.pdf-frame-wrap{
    width:100%;
    margin-top:22px;
    border:1px solid var(--line);
    border-radius:10px;
    overflow:hidden;
    background:#f3f3f3
}

.pdf-frame{
    display:block;
    width:100%;
    height:min(68vh,760px);
    min-height:520px;
    border:0;
    background:#fff
}


/* Apertura directa de PDF en móvil */

.pdf-mobile-open{
    display:none
}

.pdf-open-button{
    appearance:none;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:48px;
    padding:13px 24px;
    border:1px solid #e69a27;
    border-radius:7px;
    background:var(--orange);
    color:var(--ink);
    font-size:15px;
    font-weight:700;
    line-height:1.25;
    text-align:center;
    text-decoration:none;
    cursor:pointer
}

.pdf-open-button:hover{
    background:var(--gold);
    text-decoration:none
}

.pdf-open-button:focus-visible{
    outline:3px solid var(--ink);
    outline-offset:3px
}

.pdf-mobile-help{
    margin:12px 0 0;
    color:#626262;
    font-size:12px;
    line-height:1.55;
    text-align:center
}

.public-help{
    margin:14px 0 0;
    font-size:12px
}

.public-help a{
    text-decoration:underline;
    text-underline-offset:2px
}

.public-access-card:not(:has(.pdf-frame)){
    max-width:620px;
    margin-top:8vh;
    padding:42px
}


@media(max-width:760px){

    .access-grid{
        grid-template-columns:1fr
    }

    .public-access-shell{
        min-height:100dvh;
        padding:12px;
        place-items:start center
    }

    .public-access-card{
        width:100%;
        padding:22px 16px;
        margin:0
    }

    .public-logo{
        width:min(280px,80%);
        margin-bottom:22px
    }

    .public-access-card h1{
        font-size:29px;
        line-height:1.2
    }

    /*
     * Chrome móvil/Android no gestiona de forma fiable
     * la visualización de PDF dentro de iframe.
     */
    .pdf-frame-wrap{
        display:none
    }

    /*
     * En móvil presentamos una acción directa al PDF.
     */
    .pdf-mobile-open{
        display:block;
        margin-top:24px;
        padding:22px 18px;
        border:1px solid var(--line);
        border-radius:10px;
        background:#fafafa;
        text-align:center
    }

    .pdf-open-button{
        display:flex;
        width:100%;
        min-height:52px;
        padding:14px 18px
    }

    .pdf-mobile-help{
        margin-top:12px
    }

    /*
     * El enlace secundario sigue disponible como respaldo,
     * pero pierde protagonismo frente al botón principal.
     */
    .public-help{
        margin-top:18px;
        font-size:11px
    }

    .access-dates{
        grid-template-columns:1fr
    }

    /*
     * En estados caducado/revocado/etc. no queremos
     * aplicar el margen grande usado en escritorio.
     */
    .public-access-card:not(:has(.pdf-frame)){
        margin-top:20px;
        padding:28px 20px
    }
}


/* A04.1 - modal QR inmediato tras la carga */

.qr-modal-backdrop{
    position:fixed;
    inset:0;
    z-index:1000;
    background:rgba(20,20,20,.55);
    display:grid;
    place-items:center;
    padding:24px
}

.qr-modal{
    position:relative;
    width:min(560px,100%);
    max-height:calc(100dvh - 48px);
    overflow:auto;
    background:#fff;
    border-radius:15px;
    border-top:5px solid var(--orange);
    padding:30px;
    box-shadow:0 24px 70px rgba(0,0,0,.24);
    text-align:center
}

.qr-modal h2{
    font-size:25px;
    margin:10px 0
}

.qr-modal>p{
    margin:0 0 10px
}

.qr-modal-close{
    position:absolute;
    top:12px;
    right:14px;
    border:0;
    background:transparent;
    font-size:30px;
    line-height:1;
    cursor:pointer;
    color:#555
}

.qr-modal-code{
    max-width:280px
}

.qr-modal .public-url{
    text-align:left;
    margin-top:16px
}

.qr-modal .form-actions{
    justify-content:center
}

@media(max-width:620px){
    .qr-modal-backdrop{
        padding:12px
    }

    .qr-modal{
        padding:24px 18px
    }

    .qr-modal .access-dates{
        grid-template-columns:1fr
    }

    .qr-modal .form-actions{
        display:grid
    }

    .qr-modal .button{
        width:100%;
        justify-content:center
    }
}


/* A05 - hoja corporativa A5 e impresión */

.print-preview-page{
    margin:0;
    background:#e9eaec;
    color:var(--ink);
    font-family:Arial,Helvetica,sans-serif
}

.a5-preview-toolbar{
    position:sticky;
    top:0;
    z-index:20;
    display:flex;
    justify-content:center;
    gap:10px;
    padding:14px;
    background:rgba(255,255,255,.96);
    border-bottom:1px solid var(--line)
}

.a5-preview-toolbar .button{
    margin:0
}

.a5-sheet{
    width:148mm;
    min-height:210mm;
    margin:18px auto 30px;
    background:#fff;
    padding:13mm 12mm 10mm;
    box-shadow:0 14px 40px rgba(0,0,0,.14);
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center
}

.a5-brand{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding-bottom:6mm;
    border-bottom:1px solid var(--line)
}

.a5-brand img{
    width:67mm;
    height:auto
}

.a5-brand span{
    font-size:8pt;
    font-weight:700;
    letter-spacing:1.4pt;
    color:#626262
}

.a5-copy{
    padding-top:8mm
}

.a5-copy h1{
    font-size:23pt;
    letter-spacing:-.7pt;
    margin:2.5mm 0 2mm
}

.a5-copy p{
    font-size:10pt;
    margin:0 auto;
    max-width:105mm
}

.a5-qr{
    display:grid;
    place-items:center;
    width:72mm;
    height:72mm;
    margin:7mm auto 5mm
}

.a5-qr svg{
    display:block;
    width:72mm;
    height:72mm
}

.a5-reference{
    width:100%;
    padding:4mm;
    border-radius:3mm;
    background:#fff6e5;
    border:1px solid #f0d5a4
}

.a5-reference span,
.a5-reference strong{
    display:block
}

.a5-reference span{
    font-size:8pt;
    text-transform:uppercase;
    letter-spacing:1pt;
    color:#76500d
}

.a5-reference strong{
    font-size:17pt;
    margin-top:1mm
}

.a5-meta{
    width:100%;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:3mm;
    margin:4mm 0 0
}

.a5-meta div{
    border:1px solid var(--line);
    border-radius:2.5mm;
    padding:3mm
}

.a5-meta dt{
    font-size:7.5pt;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.5pt
}

.a5-meta dd{
    font-size:9pt;
    margin:1mm 0 0
}

.a5-url{
    width:100%;
    font-size:7.5pt;
    overflow-wrap:anywhere;
    margin:4mm 0 0;
    color:#555
}

.a5-warning{
    width:100%;
    font-size:8.5pt;
    background:#fff0f0;
    border:1px solid #e1b8b8;
    color:#6e1e1e;
    border-radius:2mm;
    padding:2.5mm;
    margin:4mm 0 0
}

.a5-foot{
    width:100%;
    margin-top:auto;
    padding-top:4mm;
    border-top:1px solid var(--line);
    font-size:7pt;
    color:#666
}

@page{
    size:A5 portrait;
    margin:0
}

@media print{
    html,
    body.print-preview-page{
        width:148mm;
        height:210mm;
        background:#fff
    }

    .a5-preview-toolbar{
        display:none!important
    }

    .a5-sheet{
        width:148mm;
        height:210mm;
        min-height:210mm;
        margin:0;
        box-shadow:none;
        page-break-after:avoid;
        overflow:hidden
    }

    .a5-sheet a{
        color:inherit;
        text-decoration:none
    }
}

@media(max-width:620px){
    .a5-preview-toolbar{
        position:static
    }

    .a5-sheet{
        width:calc(100% - 24px);
        min-height:auto;
        margin:12px;
        padding:24px 18px
    }

    .a5-brand{
        display:block
    }

    .a5-brand img{
        width:min(280px,85%)
    }

    .a5-brand span{
        display:block;
        margin-top:12px
    }

    .a5-meta{
        grid-template-columns:1fr
    }
}


/* A05 consolidado - acción principal de carga */

.upload-primary{
    font-size:15px;
    padding:14px 22px;
    box-shadow:0 7px 18px rgba(249,174,59,.24)
}

.upload-primary>span{
    font-size:20px;
    line-height:1
}

.upload-primary:hover{
    transform:translateY(-1px)
}


/* A06 - trazabilidad y auditoría */

.audit-stats{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:14px;
    margin-bottom:18px
}

.audit-stats article{
    background:#fff;
    border:1px solid var(--line);
    border-radius:11px;
    padding:18px
}

.audit-stats span,
.audit-access-summary span{
    display:block;
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:.7px;
    color:#666
}

.audit-stats strong,
.audit-access-summary strong{
    display:block;
    font-size:26px;
    margin-top:4px
}

.audit-filter-panel{
    margin-bottom:18px
}

.audit-filters{
    display:grid;
    grid-template-columns:repeat(4,minmax(130px,1fr));
    gap:14px;
    align-items:end
}

.audit-filters label{
    display:block;
    font-size:11px;
    font-weight:bold;
    margin-bottom:6px
}

.audit-filters input,
.audit-filters select{
    width:100%;
    border:1px solid #cfcfcf;
    border-radius:8px;
    padding:10px 11px;
    background:#fff;
    font:inherit
}

.audit-filter-wide{
    grid-column:span 2
}

.audit-filter-actions{
    display:flex;
    gap:8px;
    align-items:center
}

.audit-section{
    margin-top:18px
}

.audit-section-head{
    padding:22px 24px 16px;
    border-bottom:1px solid var(--line);
    display:flex;
    justify-content:space-between;
    gap:20px;
    align-items:end
}

.audit-section-head h2{
    margin:4px 0 0
}

.audit-section-head p{
    font-size:12px;
    margin:0;
    max-width:520px;
    text-align:right
}

.audit-table{
    min-width:980px
}

.internal-audit-table{
    min-width:850px
}

.audit-meta{
    display:block;
    max-width:440px;
    white-space:normal;
    overflow-wrap:anywhere;
    font-size:11px
}

.audit-retention-note{
    font-size:12px;
    margin:18px 0 0
}

.audit-access-summary{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:14px;
    margin-bottom:18px
}

.audit-access-summary .panel{
    padding:18px
}

.audit-access-meta{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:0;
    padding:0;
    overflow:hidden
}

.audit-access-meta>div{
    padding:17px 20px;
    border-right:1px solid var(--line);
    border-bottom:1px solid var(--line)
}

.audit-access-meta>div:nth-child(3n){
    border-right:0
}

.audit-access-meta>div:nth-last-child(-n+3){
    border-bottom:0
}

.audit-access-meta strong,
.audit-access-meta span{
    display:block
}

.audit-access-meta strong{
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:.5px
}

.audit-access-meta span{
    font-size:13px;
    margin-top:4px;
    color:#555
}

@media(max-width:900px){
    .audit-stats,
    .audit-access-summary{
        grid-template-columns:repeat(2,1fr)
    }

    .audit-filters{
        grid-template-columns:repeat(2,1fr)
    }

    .audit-filter-wide{
        grid-column:span 2
    }

    .audit-access-meta{
        grid-template-columns:1fr 1fr
    }

    .audit-access-meta>div:nth-child(3n){
        border-right:1px solid var(--line)
    }

    .audit-access-meta>div:nth-child(2n){
        border-right:0
    }

    .audit-access-meta>div:nth-last-child(-n+3){
        border-bottom:1px solid var(--line)
    }

    .audit-access-meta>div:nth-last-child(-n+2){
        border-bottom:0
    }
}

@media(max-width:620px){
    .audit-stats,
    .audit-access-summary,
    .audit-filters,
    .audit-access-meta{
        grid-template-columns:1fr
    }

    .audit-filter-wide{
        grid-column:auto
    }

    .audit-filter-actions{
        flex-wrap:wrap
    }

    .audit-section-head{
        display:block
    }

    .audit-section-head p{
        text-align:left;
        margin-top:7px
    }

    .audit-access-meta>div{
        border-right:0!important;
        border-bottom:1px solid var(--line)!important
    }

    .audit-access-meta>div:last-child{
        border-bottom:0!important
    }

    .upload-primary{
        width:100%;
        margin-top:18px
    }
}


/* A07 */

.form-success{
    padding:14px 16px;
    margin:0 0 18px;
    border:1px solid #b9d9bd;
    background:#edf8ef;
    border-radius:8px;
    color:#245c2c
}

.auth-help .text-link{
    font-weight:700
}

.status-badge{
    white-space:nowrap
}

/* A04.1 - envío de correo directamente desde modal QR */

.qr-modal-mail{
    margin-top:18px;
    padding:18px;
    border:1px solid var(--line);
    border-radius:10px;
    background:#fafafa;
    text-align:left
}

.qr-modal-mail-heading{
    margin-bottom:14px;
    text-align:center
}

.qr-modal-mail-heading .eyebrow{
    display:block;
    margin-bottom:4px
}

.qr-modal-mail-heading p{
    margin:0;
    font-size:12px;
    color:#626262
}

.qr-modal-mail-form{
    display:grid;
    gap:14px
}

.qr-modal-mail-fields{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px
}

.qr-modal-mail-form .field{
    gap:6px
}

.qr-modal-mail-form .field label{
    font-size:12px
}

.qr-modal-mail-form input{
    width:100%;
    min-width:0;
    border:1px solid #cfcfcf;
    border-radius:8px;
    padding:11px 12px;
    background:#fff;
    color:var(--ink);
    font:inherit;
    font-size:13px
}

.qr-modal-mail-form input:focus{
    border-color:var(--orange);
    outline:3px solid rgba(249,174,59,.18)
}

.qr-modal-mail-submit{
    width:100%;
    margin:0;
    min-height:44px
}

.qr-modal-actions{
    justify-content:center;
    margin-top:18px
}

@media(max-width:620px){

    .qr-modal-mail{
        padding:15px
    }

    .qr-modal-mail-fields{
        grid-template-columns:1fr
    }

    .qr-modal-actions{
        display:grid;
        grid-template-columns:1fr
    }

    .qr-modal-actions .button{
        width:100%;
        margin:0
    }

}

/* Iconos Bootstrap integrados en botones */

.button-icon{
    display:block;
    width:16px;
    height:16px;
    flex:0 0 auto
}

.a5-preview-toolbar .button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px
}
/* UI-H01 - Nuevo Historial */
.history-heading{margin-bottom:14px}
.history-tabs{display:flex;gap:8px;margin:0 0 14px;border-bottom:1px solid var(--line)}
.history-tab{display:inline-flex;align-items:center;padding:11px 15px;margin-bottom:-1px;border:1px solid transparent;border-bottom:0;border-radius:9px 9px 0 0;color:#666;font-weight:700;text-decoration:none}
.history-tab:hover{color:var(--ink);background:#fafafa}
.history-tab.active{color:var(--ink);background:#fff;border-color:var(--line);box-shadow:0 -2px 0 var(--orange) inset}
.history-panel{overflow:hidden}
.history-filters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:20px 22px;border-bottom:1px solid var(--line);background:#fafafa}
.history-filters label{display:block;margin-bottom:5px;font-size:11px;font-weight:800;letter-spacing:.35px;text-transform:uppercase;color:#5e5e5e}
.history-filters input,.history-filters select{width:100%;min-width:0;border:1px solid #cfcfcf;border-radius:8px;padding:10px 11px;background:#fff;color:var(--ink);font:inherit}
.history-filter-wide{grid-column:span 2}
.history-filter-actions{display:flex;gap:8px;align-items:end;flex-wrap:wrap}
.history-table-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 22px;border-bottom:1px solid var(--line)}
.history-documents-table{min-width:940px}
.history-login-table{min-width:620px}
.history-file-name{max-width:330px;overflow-wrap:anywhere}
.history-state{display:inline-flex;align-items:center;min-height:26px;padding:4px 9px;border-radius:999px;font-size:11px;font-weight:800;white-space:nowrap}
.history-state-ok{background:#edf8ef;color:#245c2c}
.history-state-pending{background:#fff7df;color:#775500}
.history-state-error{background:#fdecec;color:#8b2525}
.history-state-muted{background:#f0f0f0;color:#626262}
.history-pagination-wrap{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 22px;border-top:1px solid var(--line);font-size:12px;color:#666}
.history-pagination-wrap .pagination{margin:0}
.history-print-page{max-width:1180px;margin:0 auto;padding:26px;background:#fff;color:#292929}
.history-print-toolbar{display:flex;justify-content:flex-end;margin-bottom:18px}
.history-print-header{display:flex;align-items:center;gap:18px;padding-bottom:14px;border-bottom:2px solid #292929}
.history-print-header img{width:125px;height:auto}
.history-print-header span{font-size:11px;font-weight:800;letter-spacing:1px}
.history-print-header h1{margin:3px 0;font-size:23px}
.history-print-header p{margin:0;font-size:11px;color:#666}
.history-print-filters{display:flex;flex-wrap:wrap;gap:8px 18px;padding:12px 0;font-size:11px;border-bottom:1px solid #ddd}
.history-print-table{width:100%;border-collapse:collapse;margin-top:14px;font-size:10px}
.history-print-table th,.history-print-table td{padding:7px 6px;border-bottom:1px solid #ddd;text-align:left;vertical-align:top}
.history-print-table th{font-size:9px;text-transform:uppercase;letter-spacing:.3px;background:#f5f6f7}
.history-print-table small{font-size:9px;color:#666}
@media(max-width:900px){.history-filters{grid-template-columns:repeat(2,minmax(0,1fr))}.history-filter-wide{grid-column:span 2}}
@media(max-width:620px){.history-tabs{overflow-x:auto}.history-tab{white-space:nowrap}.history-filters{grid-template-columns:1fr}.history-filter-wide{grid-column:auto}.history-table-toolbar,.history-pagination-wrap{align-items:flex-start;flex-direction:column}.history-filter-actions .button{flex:1}.history-table-toolbar .button{width:100%}}
@media print{.history-print-toolbar{display:none!important}.history-print-page{max-width:none;padding:0}.history-print-header img{width:105px}.history-print-table{font-size:9px}.history-print-table th,.history-print-table td{padding:5px 4px}.history-print-table tr{break-inside:avoid}.print-preview-page{background:#fff}}

/* UI-DOC-PAG v1.0.0 ----------------------------------------------------- */
.documents-pagination-wrap{flex-wrap:wrap}
.documents-per-page{display:flex;align-items:center;gap:8px;margin:0}
.documents-per-page label{font-weight:700;white-space:nowrap;color:var(--text)}
.documents-per-page select{min-width:72px;padding:.5rem .65rem;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--text)}
.pagination .current{display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:34px;padding:0 10px;border-radius:8px;background:var(--accent);color:var(--text);font-weight:800}
@media(max-width:620px){.documents-pagination-wrap{align-items:flex-start;flex-direction:column}.documents-per-page{width:100%;justify-content:space-between}}

/* UI-DOC-V01 - Versionado y sustitución de PDF -------------------------- */
.version-update-panel,.version-history-panel{margin-top:16px}
.version-warning{padding:15px 17px;border:1px solid #f0cf82;border-radius:10px;background:#fff8e7;color:#5e4a15;margin-bottom:18px}
.version-warning strong{display:block;margin-bottom:5px;color:#3f3210}
.version-warning p{margin:0;line-height:1.5}
.version-current-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:20px}
.version-current-grid>div{padding:13px 14px;border:1px solid var(--line);border-radius:9px;background:#fafafa;min-width:0}
.version-current-grid span{display:block;margin-bottom:4px;font-size:10px;font-weight:800;letter-spacing:.45px;text-transform:uppercase;color:#777}
.version-current-grid strong{display:block;overflow-wrap:anywhere}
.version-upload-form{max-width:760px}
.version-history-heading{display:flex;align-items:end;justify-content:space-between;gap:16px;padding:18px 22px 12px}
.version-history-heading h2{margin:3px 0 0}
.version-table{min-width:920px}
.version-previous{background:#f0f0f0;color:#626262}
@media(max-width:900px){.version-current-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.version-current-grid{grid-template-columns:1fr}.version-history-heading{align-items:flex-start;flex-direction:column}}

/* UI-DOC-DECA01 */
.form-grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.documents-filters{margin-bottom:18px}.documents-filters .history-filter-grid{grid-template-columns:160px minmax(220px,1.2fr) minmax(180px,1fr) minmax(180px,1fr)}@media(max-width:900px){.form-grid-2,.documents-filters .history-filter-grid{grid-template-columns:1fr}}