:root{--blue:#00558C;--blue2:#003E6B;--navy:#002B4A;--red:#D71920;--red2:#A90F18;--gold:#F7B32B;--green:#00A98F;--bg:#F4F8FB;--text:#1E293B;--muted:#64748B;--line:#D8E5EE;--shadow:0 18px 45px rgba(0,43,74,.12);--radius:24px}
*{box-sizing:border-box} img{max-width:100%;height:auto} body{margin:0;background:radial-gradient(circle at 8% 12%,rgba(215,25,32,.08),transparent 24%),radial-gradient(circle at 92% 10%,rgba(0,85,140,.14),transparent 30%),linear-gradient(180deg,#F9FCFE 0%,#EFF6FA 100%)!important;color:var(--text);font-family:"Segoe UI",system-ui,Arial,sans-serif}
.topnav{position:sticky;top:0;z-index:1030;background:rgba(0,62,107,.97);backdrop-filter:blur(10px);box-shadow:0 12px 30px rgba(0,43,74,.22)}
.topnav-inner{max-width:1380px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 24px}
.brand{display:flex;align-items:center;gap:12px;color:white;text-decoration:none;font-weight:950}.brand:hover{color:white}.brand img{width:52px!important;height:52px!important;min-width:52px!important;max-width:52px!important;object-fit:contain!important;background:white;border-radius:15px;padding:4px}.brand small{display:block;opacity:.75;font-weight:600;font-size:12px;margin-top:-3px}
.menu{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.menu a{color:rgba(255,255,255,.88);text-decoration:none;padding:10px 14px;border-radius:999px;font-weight:750}.menu a:hover,.menu a.active{background:rgba(255,255,255,.14);color:white}.menu .login{background:white;color:var(--blue2)}.menu .logout{background:var(--red);color:white}.menu .admin{background:var(--gold);color:#2b2100}
.hero{background:radial-gradient(circle at 18% 20%,rgba(255,255,255,.17),transparent 26%),linear-gradient(135deg,var(--blue2),var(--blue) 58%,var(--red));color:white;padding:62px 0;border-bottom-left-radius:46px;border-bottom-right-radius:46px}.hero h1{font-weight:950;font-size:clamp(2rem,4vw,4rem)}.hero p{font-size:1.15rem;opacity:.9}
.cardx,.chart-card,.admin-card,.search-panel,.recent-box{background:rgba(255,255,255,.96);border:1px solid rgba(0,85,140,.08);border-radius:var(--radius);padding:26px;box-shadow:var(--shadow)}.title{color:var(--blue2);font-weight:950}.muted{color:var(--muted)}
.btn-red{background:linear-gradient(135deg,var(--red),var(--red2))!important;color:white!important;border:0!important;border-radius:15px!important;padding:11px 20px!important;font-weight:850!important;box-shadow:0 12px 22px rgba(215,25,32,.22)}.btn-blue{background:linear-gradient(135deg,var(--blue),var(--blue2))!important;color:white!important;border:0!important;border-radius:15px!important;padding:11px 20px!important;font-weight:850!important;box-shadow:0 12px 22px rgba(0,85,140,.22)}.btn-soft{border:1px solid rgba(0,85,140,.22)!important;color:var(--blue2)!important;background:white!important;border-radius:15px!important;font-weight:750!important}
.form-control,.form-select{border-radius:15px!important;padding:12px 14px!important;border:1px solid var(--line)!important}.footer{background:var(--navy);color:white;text-align:center;padding:16px;font-size:14px;margin-top:40px}
.grid-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin:26px 0}.stat{position:relative;overflow:hidden;border-radius:28px;padding:26px;min-height:170px;color:white;box-shadow:0 18px 42px rgba(0,43,74,.16)}.stat:before{content:"";position:absolute;width:145px;height:145px;right:-36px;top:-38px;background:rgba(255,255,255,.16);border-radius:50%}.stat .icon{font-size:34px;margin-bottom:18px;display:block}.stat span{font-weight:800;opacity:.9}.stat strong{display:block;font-size:44px;font-weight:950;line-height:1;margin-top:12px}.blue{background:linear-gradient(135deg,var(--blue2),var(--blue))}.red{background:linear-gradient(135deg,var(--red2),var(--red))}.green{background:linear-gradient(135deg,#007E6D,var(--green))}.gold{background:linear-gradient(135deg,#A86B00,var(--gold));color:white}
.actions{display:grid;grid-template-columns:1.1fr .9fr;gap:24px}.action-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.tile{background:linear-gradient(180deg,#fff,#F6FAFD);border:1px solid rgba(0,85,140,.10);border-radius:22px;padding:20px;text-decoration:none;color:var(--text);transition:.18s;min-height:138px;display:flex;flex-direction:column;justify-content:space-between}.tile:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(0,43,74,.14);color:var(--blue2)}.tile .ico{font-size:30px}.tile strong{font-size:17px;color:var(--blue2)}.tile small{color:var(--muted)}
.mini-list{display:flex;flex-direction:column;gap:12px}.mini-item{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-radius:16px;background:white;border:1px solid #E6EEF5}.badge-ok,.badge-error,.badge-warn,.badge-info{border-radius:999px;padding:6px 12px;font-weight:850;font-size:12px;display:inline-block}.badge-ok{background:#E8F7F1;color:#047857}.badge-error{background:#FDE8E8;color:#B91C1C}.badge-warn{background:#FFF3CD;color:#8A6400}.badge-info{background:#EAF4FB;color:var(--blue2)}
.catalog-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}.book-card{background:white;border-radius:24px;overflow:hidden;box-shadow:0 10px 26px rgba(0,43,74,.10);height:100%;transition:.18s;border:1px solid rgba(0,85,140,.08)}.book-card:hover{transform:translateY(-5px);box-shadow:0 18px 38px rgba(0,43,74,.16)}.book-cover{height:190px;background:linear-gradient(135deg,rgba(0,85,140,.12),rgba(255,255,255,.9)),radial-gradient(circle at 80% 20%,rgba(215,25,32,.12),transparent 30%);display:grid;place-items:center;font-size:56px;color:var(--blue);border-bottom:5px solid var(--red)}.book-cover img{width:100%;height:100%;object-fit:cover;display:block}.book-body{padding:18px}.book-title{font-weight:900;color:var(--blue2);font-size:16px;min-height:45px;line-height:1.25}.book-meta{color:var(--muted);font-size:13px;line-height:1.45;margin:10px 0}
.login-shell{min-height:calc(100vh - 80px);display:flex;align-items:center;justify-content:center;padding:32px 18px}.login-panel{width:min(1120px,96vw);min-height:620px;background:white;border-radius:34px;overflow:hidden;box-shadow:0 30px 70px rgba(0,43,74,.18);display:grid;grid-template-columns:44% 56%}.login-brand{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:48px;color:white;background:linear-gradient(145deg,var(--blue2),var(--blue) 54%,var(--red))}.login-logo-wrap{width:172px;height:172px;border-radius:38px;background:white;display:flex;align-items:center;justify-content:center;box-shadow:0 18px 42px rgba(0,0,0,.20);margin-bottom:28px;padding:14px}.login-logo{width:100%!important;height:100%!important;object-fit:contain!important}.login-form{display:flex;flex-direction:column;justify-content:center;padding:56px 64px}.login-tabs .nav-link{border-radius:999px;font-weight:800;color:var(--blue2);padding:11px 22px}.login-tabs .nav-link.active{background:var(--blue)!important;color:white!important}.login-title{color:var(--blue2);font-weight:950;font-size:2.25rem}.google-disabled{width:100%;border-radius:16px;padding:12px 18px;font-weight:750;border:1px dashed #B8C6D1;color:#7B8794;background:#F7FAFC;text-align:center}
.table thead th{color:var(--blue2);border-bottom:2px solid #DDEAF2}.table tbody tr:hover{background:#F7FBFD}.row-atrasado{background:#FDE8E8!important}.row-prestado{background:#FFF8E1!important}.row-devuelto{background:#E8F7F1!important}
@media(max-width:1100px){.grid-stats{grid-template-columns:repeat(2,1fr)}.actions{grid-template-columns:1fr}.action-grid{grid-template-columns:repeat(2,1fr)}.catalog-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:760px){.topnav-inner{display:block}.menu{margin-top:12px}.grid-stats,.action-grid,.catalog-grid{grid-template-columns:1fr}.login-panel{grid-template-columns:1fr}.login-brand{padding:34px 24px}.login-logo-wrap{width:132px;height:132px;border-radius:28px}.login-form{padding:36px 24px}}@media print{nav,.btn,.no-print{display:none!important}body{background:#fff!important}.cardx,.chart-card,.admin-card{box-shadow:none!important;border:0!important}}


/* =====================================================
   MEJORAS FINALES SIN CAMBIAR DISEÑO BASE
   Logo, iconos y tarjetas proporcionadas
   ===================================================== */

/* Evita logos gigantes en cualquier página */
img{
    max-width:100%;
    height:auto;
}

.brand img,
.topnav .brand img{
    width:52px !important;
    height:52px !important;
    min-width:52px !important;
    max-width:52px !important;
    object-fit:contain !important;
    display:block !important;
}

/* Login: logo centrado y proporcional */
.login-logo-wrap{
    width:150px !important;
    height:150px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
}

.login-logo-wrap img,
.login-logo{
    width:100% !important;
    height:100% !important;
    max-width:130px !important;
    max-height:130px !important;
    object-fit:contain !important;
}

/* Iconos de tarjetas del dashboard */
.stat .icon,
.admin-stat .icon,
.dash-icon{
    font-size:32px !important;
    line-height:1 !important;
    width:auto !important;
    height:auto !important;
    display:inline-block !important;
}

/* Iconos acciones rápidas */
.tile .ico,
.action-tile .tile-icon,
.dash-action span{
    font-size:28px !important;
    line-height:1 !important;
    width:auto !important;
    height:auto !important;
    display:inline-block !important;
}

/* Si algún ícono entra como imagen, se controla */
.tile img,
.action-tile img,
.stat img,
.admin-stat img{
    width:34px !important;
    height:34px !important;
    max-width:34px !important;
    max-height:34px !important;
    object-fit:contain !important;
}

/* Imágenes sueltas del logo dentro de contenido */
main > img,
.container > img,
.cardx > img,
.admin-card > img,
.chart-card > img{
    width:auto !important;
    max-width:140px !important;
    max-height:140px !important;
    object-fit:contain !important;
}

/* Imágenes de tabla */
.table img{
    width:45px !important;
    height:45px !important;
    max-width:45px !important;
    max-height:45px !important;
    object-fit:cover !important;
    border-radius:10px !important;
}

/* Portadas sí deben ocupar su contenedor */
.book-cover img{
    width:100% !important;
    height:100% !important;
    max-width:none !important;
    max-height:none !important;
    object-fit:cover !important;
}

/* Tarjetas del dashboard más elegantes sin cambiar estructura */
.stat{
    transition:.2s ease-in-out;
}

.stat:hover{
    transform:translateY(-5px);
    box-shadow:0 24px 52px rgba(0,43,74,.20);
}

.tile{
    position:relative;
    overflow:hidden;
}

.tile:after{
    content:"";
    position:absolute;
    right:-28px;
    top:-28px;
    width:90px;
    height:90px;
    border-radius:999px;
    background:rgba(0,85,140,.06);
}

.tile:hover{
    transform:translateY(-5px);
    box-shadow:0 18px 35px rgba(0,43,74,.15);
}

/* Botones de exportación pequeños y proporcionados */
.tile .btn{
    padding:8px 12px !important;
    border-radius:12px !important;
    font-size:13px !important;
}

/* Badges más modernos */
.badge-ok,
.badge-error,
.badge-warn,
.badge-info{
    white-space:nowrap;
}

/* Responsive */
@media(max-width:700px){
    .brand img,
    .topnav .brand img{
        width:44px !important;
        height:44px !important;
        min-width:44px !important;
        max-width:44px !important;
    }

    .stat .icon,
    .admin-stat .icon,
    .dash-icon{
        font-size:28px !important;
    }

    .tile .ico,
    .action-tile .tile-icon,
    .dash-action span{
        font-size:26px !important;
    }
}

/* Mejoras gestión de préstamos */
.stat{color:white!important}
.stat:hover{transform:translateY(-5px);box-shadow:0 24px 52px rgba(0,43,74,.20)}
.table form{margin:0}
.row-atrasado td{background:#FDE8E8!important}
.row-prestado td{background:#FFF8E1!important}
.row-devuelto td{background:#E8F7F1!important}
.btn-sm{border-radius:12px!important;font-weight:800!important}


/* =====================================================
   AJUSTE FINAL BOTONES DE PRÉSTAMOS SIN ÍCONOS
   ===================================================== */

.admin-card .table-responsive{
    overflow-x:auto;
}

.admin-card table{
    min-width:1350px;
}

.col-acciones{
    width:310px !important;
    min-width:310px !important;
}

.acciones{
    width:310px !important;
    min-width:310px !important;
    max-width:310px !important;
}

.acciones-wrap{
    display:flex !important;
    flex-wrap:wrap !important;
    gap:8px !important;
    align-items:center !important;
    justify-content:flex-start !important;
    max-width:300px !important;
}

.btn-accion{
    min-width:116px;
    height:38px;
    padding:0 12px;
    border:none;
    border-radius:12px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-weight:800;
    font-size:13px;
    line-height:1;
    white-space:nowrap;
    box-shadow:0 8px 18px rgba(0,43,74,.12);
    cursor:pointer;
}

.btn-aprobar{
    background:#00A98F;
    color:white;
}

.btn-rechazar{
    background:#D71920;
    color:white;
}

.btn-entregar{
    background:#F7B32B;
    color:#1E293B;
}

.btn-devuelto{
    background:#00558C;
    color:white;
}

.btn-atrasado{
    background:#D71920;
    color:white;
}

.btn-guardar-fecha{
    min-width:78px;
    height:38px;
    padding:0 10px;
    border:1px solid #D8E5EE;
    border-radius:12px;
    background:white;
    color:#003E6B;
    font-weight:800;
    font-size:12px;
    white-space:nowrap;
}

td .form-control-sm{
    min-width:130px;
}

@media(max-width:900px){
    .admin-card table{
        min-width:1200px;
    }

    .col-acciones,
    .acciones{
        width:280px !important;
        min-width:280px !important;
        max-width:280px !important;
    }

    .acciones-wrap{
        max-width:270px !important;
    }

    .btn-accion{
        min-width:105px;
        font-size:12px;
    }
}