:root{
    --green-950:#031510;
    --green-900:#082f24;
    --green-800:#0d3f31;
    --green-700:#14543f;
    --green-100:#e7f4ed;
    --yellow:#f4c430;
    --yellow-soft:#fff3bf;
    --red:#991b1b;
    --red-soft:#fee2e2;
    --text:#1f2937;
    --muted:#6b7280;
    --bg:#f5f7f4;
    --white:#fff;
    --border:#e5e7eb;
    --shadow:0 18px 40px rgba(8,47,36,.12);
}

*{box-sizing:border-box}

body{
    margin:0;
    font-family:Arial,Helvetica,sans-serif;
    color:var(--text);
    background:var(--bg);
}

.auth-body{
    min-height:100vh;
    display:grid;
    place-items:center;
    background:
        linear-gradient(135deg,rgba(3,21,16,.88),rgba(8,47,36,.82)),
        url('/images/background-login.jpg') center/cover no-repeat;
    padding:24px;
}

.auth-card{
    width:min(460px,94vw);
    background:rgba(255,255,255,.96);
    border-radius:28px;
    padding:32px;
    box-shadow:0 28px 70px rgba(0,0,0,.38);
    border:1px solid rgba(244,196,48,.25);
}

.auth-logo{text-align:center;margin-bottom:16px}
.auth-logo img{width:118px;height:118px;object-fit:contain;filter:drop-shadow(0 10px 22px rgba(0,0,0,.22))}
.auth-card h1{margin:0;text-align:center;color:var(--green-900)}
.auth-card p{color:var(--muted);line-height:1.5;text-align:center}
.auth-card label{display:block;font-weight:900;color:var(--green-900);margin:12px 0 7px}
.auth-card input{width:100%;padding:14px;border:1px solid #d1d5db;border-radius:14px;font-size:15px;background:white}
.auth-card input:focus{outline:2px solid rgba(244,196,48,.55);border-color:var(--yellow)}
.auth-card button{width:100%;background:var(--green-800);color:white;border:0;border-radius:14px;padding:15px;font-weight:900;cursor:pointer;font-size:15px}
.auth-card button:hover{background:var(--green-900)}
.auth-row{display:flex;justify-content:space-between;align-items:center;margin:14px 0;gap:10px}
.auth-row label{margin:0;font-weight:700;color:#374151}
a{color:var(--green-800);font-weight:900;text-decoration:none}
.error{background:var(--red-soft);color:var(--red);padding:12px;border-radius:12px;margin-bottom:14px;font-weight:700}
.status{background:#dcfce7;color:#166534;padding:12px;border-radius:12px;margin-bottom:14px;font-weight:700}

.app-layout{display:grid;grid-template-columns:280px 1fr;min-height:100vh}
.sidebar{background:linear-gradient(180deg,var(--green-950),var(--green-800));color:white;padding:24px;display:flex;flex-direction:column}
.brand{text-align:center;margin-bottom:30px}
.brand img{width:122px;margin-bottom:10px}
.brand strong{display:block;font-size:20px}
.brand span{color:var(--yellow);font-weight:900}
.nav a{display:flex;gap:10px;align-items:center;color:white;text-decoration:none;padding:13px 14px;border-radius:14px;margin-bottom:8px;font-weight:800}
.nav a:hover,.nav a.active{background:rgba(244,196,48,.16)}
.sidebar-note{margin-top:auto;border-top:1px solid rgba(255,255,255,.16);padding-top:18px;color:rgba(255,255,255,.78);font-size:13px}
.main{padding:28px}
.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;gap:16px}
h1{color:var(--green-900);margin:0}
.role{display:inline-block;background:var(--yellow-soft);color:#8a6200;border-radius:999px;padding:7px 11px;font-weight:900;font-size:12px}
.hero{background:linear-gradient(135deg,var(--green-900),var(--green-700));color:white;border-radius:26px;padding:28px;margin-bottom:22px;box-shadow:var(--shadow)}
.hero h2{margin:0 0 8px;font-size:30px}
.hero p{margin:0;color:rgba(255,255,255,.8);text-align:left}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card{background:white;border-radius:22px;padding:22px;box-shadow:var(--shadow);border:1px solid var(--border)}
.card small{display:block;color:var(--muted);font-weight:800;margin-bottom:8px}
.card strong{display:block;color:var(--green-900);font-size:26px}
.btn{display:inline-block;margin-top:16px;background:var(--green-800);color:white;text-decoration:none;padding:10px 14px;border-radius:12px;font-weight:900;border:0;cursor:pointer}
.btn:hover{background:var(--green-900)}
.btn-yellow{background:var(--yellow);color:var(--green-900)}
.btn-gray{background:#6b7280}
.btn-red{background:var(--red)}
.admin-card{background:#fffdf0;border-color:var(--yellow)}
.logout button{background:var(--red);color:white;border:0;padding:10px 14px;border-radius:12px;font-weight:900;cursor:pointer}

.page-top{background:var(--green-900);color:white;padding:20px 28px;display:flex;justify-content:space-between;align-items:center}
.page-top img{width:48px;height:48px;object-fit:contain;margin-right:12px}
.page-top-left{display:flex;align-items:center}
.page-top a{color:white;background:rgba(255,255,255,.12);padding:10px 14px;border-radius:12px}

.wrap{max-width:1180px;margin:28px auto;padding:0 18px}
.panel{background:white;border-radius:20px;padding:22px;box-shadow:var(--shadow)}
.head{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:18px}
.search{display:flex;gap:10px;margin-bottom:18px}
.search input,input,select{padding:12px;border:1px solid #d1d5db;border-radius:10px;width:100%}
table{width:100%;border-collapse:collapse}
th,td{padding:12px;border-bottom:1px solid var(--border);text-align:left;font-size:14px}
th{color:var(--green-900)}
.badge{padding:6px 10px;border-radius:999px;font-weight:900;font-size:12px}
.badge-activo{background:#dcfce7;color:#166534}
.badge-baja{background:#fee2e2;color:#991b1b}
.ok{background:#dcfce7;color:#166534;padding:12px 14px;border-radius:12px;margin-bottom:14px;font-weight:800}
.actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.small{font-size:12px;color:var(--muted)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.full{grid-column:1/-1}
.errors{background:#fee2e2;color:#991b1b;padding:12px;border-radius:12px;margin-bottom:16px}

@media(max-width:900px){
    .app-layout{grid-template-columns:1fr}
    .cards{grid-template-columns:1fr}
    .topbar{align-items:flex-start;flex-direction:column}
    .form-grid{grid-template-columns:1fr}
    .search{flex-direction:column}
}

.credit-footer{
    position:fixed;
    bottom:10px;
    right:16px;
    color:rgba(255,255,255,.70);
    font-size:12px;
    font-weight:700;
    z-index:50;
    text-shadow:0 1px 4px rgba(0,0,0,.35);
}

.credit-footer-light{
    position:fixed;
    bottom:10px;
    right:16px;
    color:rgba(8,47,36,.55);
    font-size:12px;
    font-weight:700;
    z-index:50;
}

.danger-zone{
    border:1px solid #fecaca;
    background:#fff1f2;
    border-radius:16px;
    padding:16px;
    margin:18px 0;
}

.danger-zone h3{
    margin:0 0 8px;
    color:#991b1b;
}

.danger-zone p{
    color:#7f1d1d;
}

.danger-actions{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    align-items:center;
}

.danger-actions input{
    max-width:260px;
}

.danger-zone{
    border:1px solid #fecaca;
    background:#fff1f2;
    border-radius:16px;
    padding:16px;
    margin:18px 0;
}

.danger-zone h3{
    margin:0 0 8px;
    color:#991b1b;
}

.danger-zone p{
    color:#7f1d1d;
}

.danger-actions{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    align-items:center;
}

.danger-actions input{
    max-width:260px;
}

.info-flyer{
    background:linear-gradient(135deg,#fffdf0,#ffffff);
    border:1px solid #f4c430;
    border-radius:22px;
    padding:22px;
    box-shadow:0 16px 34px rgba(8,47,36,.10);
}

.info-flyer h2{
    margin:0 0 10px;
    color:#082f24;
}

.info-flyer-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:12px;
    margin-top:14px;
}

.info-flyer-item{
    background:#ffffff;
    border:1px solid #e5e7eb;
    border-radius:16px;
    padding:14px;
}

.info-flyer-item strong{
    color:#082f24;
    display:block;
    margin-bottom:6px;
}

@media(max-width:900px){
    .info-flyer-grid{
        grid-template-columns:1fr;
    }
}

.employee-dashboard{
    display:grid;
    gap:22px;
}

.employee-hero{
    background:linear-gradient(135deg,#082f24,#0d5b45);
    color:white;
    border-radius:28px;
    padding:30px;
    box-shadow:0 18px 40px rgba(8,47,36,.20);
}

.employee-hero h2{
    margin:0 0 8px;
    font-size:32px;
}

.employee-hero p{
    margin:0;
    color:rgba(255,255,255,.88);
    font-size:16px;
}

.employee-main-grid{
    display:grid;
    grid-template-columns:1.2fr .8fr;
    gap:22px;
}

.employee-flyer-card{
    background:white;
    border-radius:26px;
    padding:22px;
    box-shadow:0 18px 38px rgba(8,47,36,.10);
    border:1px solid #e5e7eb;
}

.employee-flyer-card h3{
    margin:0 0 8px;
    color:#082f24;
    font-size:24px;
}

.employee-flyer-card p{
    color:#475569;
    line-height:1.5;
}

.employee-flyer-image{
    width:100%;
    max-height:520px;
    object-fit:contain;
    border-radius:22px;
    background:#fff8dc;
    border:1px solid #f4c430;
}

.employee-info-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:14px;
    margin-top:16px;
}

.employee-info-item{
    background:#fffdf0;
    border:1px solid #f4c430;
    border-radius:18px;
    padding:16px;
}

.employee-info-item strong{
    display:block;
    color:#082f24;
    margin-bottom:6px;
    font-size:16px;
}

.employee-actions{
    display:grid;
    gap:16px;
}

.employee-action-card{
    background:white;
    border:1px solid #e5e7eb;
    border-radius:24px;
    padding:22px;
    box-shadow:0 18px 38px rgba(8,47,36,.10);
}

.employee-action-card .icon{
    width:48px;
    height:48px;
    border-radius:16px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#fff8dc;
    color:#082f24;
    font-size:24px;
    margin-bottom:12px;
}

.employee-action-card small{
    color:#64748b;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.04em;
}

.employee-action-card strong{
    display:block;
    color:#082f24;
    font-size:24px;
    margin:6px 0;
}

.employee-action-card p{
    color:#64748b;
    margin:0 0 14px;
    line-height:1.45;
}

.employee-secondary-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:16px;
}

@media(max-width:1100px){
    .employee-main-grid{
        grid-template-columns:1fr;
    }

    .employee-info-grid,
    .employee-secondary-grid{
        grid-template-columns:1fr;
    }
}

.employee-pro{
    max-width:1220px;
    margin:0 auto;
}

.employee-pro-hero{
    background:linear-gradient(135deg,#082f24,#0d5b45);
    color:#fff;
    border-radius:28px;
    padding:26px 30px;
    box-shadow:0 18px 40px rgba(8,47,36,.18);
    margin-bottom:24px;
}

.employee-pro-hero h2{
    margin:0 0 6px;
    font-size:30px;
    line-height:1.1;
}

.employee-pro-hero p{
    margin:0;
    color:rgba(255,255,255,.88);
    font-size:15px;
}

.employee-pro-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:18px;
    margin-bottom:24px;
}

.employee-pro-card{
    background:#fff;
    border:1px solid #e5e7eb;
    border-radius:24px;
    padding:22px;
    box-shadow:0 16px 34px rgba(8,47,36,.09);
    min-height:210px;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
}

.employee-pro-icon{
    width:62px;
    height:62px;
    border-radius:20px;
    background:#fff8dc;
    border:1px solid #f4c430;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:31px;
    margin-bottom:14px;
}

.employee-pro-card small{
    color:#64748b;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.04em;
}

.employee-pro-card strong{
    display:block;
    color:#082f24;
    font-size:24px;
    margin:6px 0 8px;
}

.employee-pro-card p{
    color:#64748b;
    line-height:1.45;
    margin:0 0 16px;
    font-size:14px;
}

.employee-pro-notice{
    max-width:980px;
    margin:0 auto;
    background:linear-gradient(135deg,#fffdf0,#ffffff);
    border:1px solid #f4c430;
    border-radius:26px;
    padding:18px;
    box-shadow:0 16px 34px rgba(8,47,36,.09);
    display:grid;
    grid-template-columns:180px 1fr;
    gap:20px;
    align-items:center;
}

.employee-pro-notice img{
    width:100%;
    max-height:180px;
    object-fit:contain;
    border-radius:18px;
    background:#fff8dc;
}

.employee-pro-notice h3{
    margin:0 0 8px;
    color:#082f24;
    font-size:24px;
}

.employee-pro-notice p{
    margin:0 0 14px;
    color:#475569;
    line-height:1.5;
}

.employee-pro-pills{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    margin-bottom:14px;
}

.employee-pro-pills span{
    background:#fff;
    border:1px solid #e5e7eb;
    border-radius:999px;
    padding:7px 11px;
    color:#082f24;
    font-size:13px;
    font-weight:800;
}

@media(max-width:1180px){
    .employee-pro-grid{
        grid-template-columns:repeat(2,1fr);
    }
}

@media(max-width:760px){
    .employee-pro-grid{
        grid-template-columns:1fr;
    }

    .employee-pro-notice{
        grid-template-columns:1fr;
        text-align:center;
    }

    .employee-pro-notice img{
        max-height:240px;
        margin:auto;
    }

    .employee-pro-pills{
        justify-content:center;
    }
}

/* Fix paginación Laravel sin Tailwind */
nav[role="navigation"] svg,
.pagination svg{
    width:20px !important;
    height:20px !important;
    max-width:20px !important;
    max-height:20px !important;
}

nav[role="navigation"]{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:8px;
    margin-top:18px;
    font-size:14px;
}

nav[role="navigation"] > div{
    max-width:100%;
}

nav[role="navigation"] a,
nav[role="navigation"] span{
    text-decoration:none;
}

/* Admin recibos PRO */
.admin-recibos-page{
    max-width:1320px;
    margin:0 auto;
}

.admin-recibos-header{
    display:grid;
    grid-template-columns:220px 1fr;
    gap:22px;
    align-items:start;
    margin-bottom:18px;
}

.admin-recibos-title h1{
    margin:0;
    color:#082f24;
    font-size:42px;
    line-height:1.05;
}

.admin-recibos-title p{
    color:#64748b;
    margin:10px 0 0;
    line-height:1.35;
}

.admin-actions-grid{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    align-items:center;
}

.admin-actions-grid .btn{
    white-space:nowrap;
}

.admin-folder-panel{
    background:#ffffff;
    border:1px solid #e5e7eb;
    border-radius:20px;
    padding:18px;
    margin:18px 0;
    box-shadow:0 12px 26px rgba(8,47,36,.07);
}

.admin-folder-panel summary{
    cursor:pointer;
    font-weight:900;
    color:#082f24;
    font-size:20px;
}

.admin-folder-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:12px;
    margin-top:16px;
}

.admin-folder-card{
    display:block;
    background:#fffdf0;
    border:1px solid #f4c430;
    border-radius:18px;
    padding:14px;
    text-decoration:none;
    color:#082f24;
}

.admin-folder-card:hover{
    transform:translateY(-1px);
    box-shadow:0 10px 22px rgba(8,47,36,.10);
}

.admin-folder-card strong{
    display:block;
    font-size:17px;
    margin-bottom:6px;
}

.admin-folder-card span{
    display:block;
    color:#475569;
    font-size:13px;
    line-height:1.45;
}

.admin-tools-panel{
    background:#fff7ed;
    border:1px solid #fed7aa;
    border-radius:20px;
    padding:16px;
    margin:18px 0;
}

.admin-tools-panel summary{
    cursor:pointer;
    font-weight:900;
    color:#9a3412;
    font-size:18px;
}

.admin-tools-content{
    margin-top:16px;
    display:grid;
    gap:16px;
}

.admin-tool-box{
    background:#ffffff;
    border:1px solid #e5e7eb;
    border-radius:16px;
    padding:16px;
}

.admin-tool-box h3{
    color:#082f24;
    margin:0 0 8px;
}

.admin-danger-box{
    border-color:#fecaca;
    background:#fff1f2;
}

.admin-danger-box h3{
    color:#991b1b;
}

.admin-table-card{
    background:#ffffff;
    border:1px solid #e5e7eb;
    border-radius:20px;
    overflow:hidden;
}

.admin-table-card table{
    margin:0;
}

.badge-tipo{
    display:inline-flex;
    align-items:center;
    border-radius:999px;
    padding:6px 10px;
    font-weight:900;
    font-size:12px;
    background:#eef2ff;
    color:#1e3a8a;
}

.badge-tipo-sac{
    background:#fff8dc;
    color:#854d0e;
}

.recibo-actions-compact{
    display:flex;
    flex-direction:column;
    gap:8px;
    align-items:flex-start;
}

.recibo-actions-compact .btn{
    padding:9px 12px;
    font-size:13px;
}

@media(max-width:1100px){
    .admin-recibos-header{
        grid-template-columns:1fr;
    }

    .admin-folder-grid{
        grid-template-columns:repeat(2,1fr);
    }
}

@media(max-width:760px){
    .admin-folder-grid{
        grid-template-columns:1fr;
    }

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

    .admin-actions-grid .btn{
        width:100%;
        text-align:center;
        justify-content:center;
    }
}
