/* ============================================================
   INK3D — Hoja de estilos propia (sin CDN, sin dependencias)
   ============================================================ */
*{box-sizing:border-box;}
body{font-family:'Segoe UI',Inter,ui-sans-serif,system-ui,Arial,sans-serif;margin:0;background:#f8fafc;color:#1e293b;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;}
input,select{font-family:inherit;}
table{border-collapse:collapse;}
::-webkit-scrollbar{width:8px;height:8px;}
::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:4px;}

/* Layout */
.flex{display:flex;} .inline-flex{display:inline-flex;}
.flex-1{flex:1 1 0%;} .flex-col{flex-direction:column;} .flex-wrap{flex-wrap:wrap;} .flex-shrink-0{flex-shrink:0;}
.grid{display:grid;}
.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr));}
.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}
.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr));}
@media(min-width:768px){
  .md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}
  .md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr));}
  .md\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr));}
  .md\:col-span-1{grid-column:span 1;}
}
@media(min-width:1024px){ .lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr));} }
.col-span-2{grid-column:span 2;}
.items-center{align-items:center;} .items-start{align-items:flex-start;} .items-end{align-items:flex-end;}
.justify-between{justify-content:space-between;} .justify-center{justify-content:center;} .justify-end{justify-content:end;}
.overflow-hidden{overflow:hidden;} .overflow-y-auto{overflow-y:auto;} .overflow-x-auto{overflow-x:auto;}
.h-screen{height:100vh;} .w-full{width:100%;} .w-64{width:16rem;} .w-20{width:5rem;} .w-16{width:4rem;}
.w-24{width:6rem;} .h-24{height:6rem;} .w-10{width:2.5rem;} .h-10{height:2.5rem;} .w-8{width:2rem;} .h-8{height:2rem;} .h-16{height:4rem;}
.object-cover{object-fit:cover;}
.max-w-7xl{max-width:80rem;} .max-w-lg{max-width:32rem;} .max-w-md{max-width:28rem;} .max-w-2xl{max-width:42rem;}
.max-h-\[90vh\]{max-height:90vh;}
.h-2\.5{height:.625rem;}
.mx-auto{margin-left:auto;margin-right:auto;} .ml-auto{margin-left:auto;}
.fixed{position:fixed;} .relative{position:relative;} .absolute{position:absolute;} .inset-0{top:0;right:0;bottom:0;left:0;} .z-50{z-index:50;} .z-10{z-index:10;}
.top-1{top:.25rem;} .left-1{left:.25rem;} .right-1{right:.25rem;} .bottom-1{bottom:.25rem;}
.hidden{display:none;}
.cursor-pointer{cursor:pointer;}
.transition{transition:all .15s ease;}

/* Spacing */
:root{--s05:.125rem;--s1:.25rem;--s1_5:.375rem;--s2:.5rem;--s2_5:.625rem;--s3:.75rem;--s4:1rem;--s5:1.25rem;--s6:1.5rem;--s7:1.75rem;--s8:2rem;}
.gap-2{gap:var(--s2);} .gap-3{gap:var(--s3);} .gap-4{gap:var(--s4);} .gap-6{gap:var(--s6);}
.p-4{padding:var(--s4);} .p-5{padding:var(--s5);} .p-6{padding:var(--s6);}
.px-1\.5{padding-left:var(--s1_5);padding-right:var(--s1_5);}
.px-2{padding-left:var(--s2);padding-right:var(--s2);}
.px-3{padding-left:var(--s3);padding-right:var(--s3);}
.px-4{padding-left:var(--s4);padding-right:var(--s4);}
.px-5{padding-left:var(--s5);padding-right:var(--s5);}
.px-6{padding-left:var(--s6);padding-right:var(--s6);}
.px-8{padding-left:var(--s8);padding-right:var(--s8);}
.py-0\.5{padding-top:var(--s05);padding-bottom:var(--s05);}
.py-1{padding-top:var(--s1);padding-bottom:var(--s1);}
.py-1\.5{padding-top:var(--s1_5);padding-bottom:var(--s1_5);}
.py-2{padding-top:var(--s2);padding-bottom:var(--s2);}
.py-2\.5{padding-top:var(--s2_5);padding-bottom:var(--s2_5);}
.py-3{padding-top:var(--s3);padding-bottom:var(--s3);}
.py-4{padding-top:var(--s4);padding-bottom:var(--s4);}
.py-5{padding-top:var(--s5);padding-bottom:var(--s5);}
.py-7{padding-top:var(--s7);padding-bottom:var(--s7);}
.pt-2{padding-top:var(--s2);} .pt-3{padding-top:var(--s3);} .pt-4{padding-top:var(--s4);}
.pb-1{padding-bottom:var(--s1);}
.mb-1{margin-bottom:var(--s1);} .mb-2{margin-bottom:var(--s2);} .mb-3{margin-bottom:var(--s3);}
.mb-4{margin-bottom:var(--s4);} .mb-6{margin-bottom:var(--s6);} .mb-8{margin-bottom:2rem;}
.mt-0\.5{margin-top:var(--s1);} .mt-1{margin-top:var(--s1);} .mt-2{margin-top:var(--s2);}
.mt-3{margin-top:var(--s3);} .mt-4{margin-top:var(--s4);}
.ml-1{margin-left:var(--s1);}
.space-y-0\.5>*+*{margin-top:var(--s1);}
.space-y-1>*+*{margin-top:var(--s1);}
.space-y-3>*+*{margin-top:var(--s3);}
.space-y-4>*+*{margin-top:var(--s4);}
.space-y-6>*+*{margin-top:var(--s6);}

/* Typography */
.text-xs{font-size:.75rem;} .text-sm{font-size:.875rem;} .text-base{font-size:1rem;}
.text-lg{font-size:1.125rem;} .text-xl{font-size:1.25rem;} .text-2xl{font-size:1.5rem;} .text-3xl{font-size:1.875rem;}
.text-\[10px\]{font-size:10px;} .text-\[11px\]{font-size:11px;}
.font-medium{font-weight:500;} .font-semibold{font-weight:600;} .font-bold{font-weight:700;}
.font-mono{font-family:'SF Mono',Consolas,monospace;}
.text-left{text-align:left;} .text-right{text-align:right;} .text-center{text-align:center;}
.uppercase{text-transform:uppercase;} .tracking-tight{letter-spacing:-0.02em;}
.underline{text-decoration:underline;}
.tracking-wide{letter-spacing:.03em;} .tracking-wider{letter-spacing:.06em;}
.leading-none{line-height:1;}

/* Colors: backgrounds */
.bg-white{background:#fff;} .bg-black\/40{background:rgba(0,0,0,.4);}
.bg-slate-50{background:#f8fafc;} .bg-slate-100{background:#f1f5f9;} .bg-slate-200{background:#e2e8f0;}
.bg-navy-700{background:#2f5597;} .bg-navy-900{background:#152548;}
.bg-accent-500{background:#f2994a;}
.bg-amber-50{background:#fffbeb;} .bg-amber-100{background:#fef3c7;}
.bg-green-50{background:#f0fdf4;} .bg-green-100{background:#dcfce7;} .bg-green-600{background:#16a34a;}
.hover\:bg-green-700:hover{background:#15803d;}
.bg-red-50{background:#fef2f2;} .bg-red-100{background:#fee2e2;} .bg-red-50\/60{background:rgba(254,242,242,.6);}
.bg-blue-50{background:#eff6ff;} .bg-blue-100{background:#dbeafe;}
.bg-purple-100{background:#f3e8ff;}
.hover\:bg-navy-900:hover{background:#152548;}
.hover\:bg-slate-50:hover{background:#f8fafc;}
.hover\:bg-slate-200:hover{background:#e2e8f0;}

/* Colors: text */
.text-white{color:#fff;}
.text-white\/30{color:rgba(255,255,255,.30);}
.text-white\/35{color:rgba(255,255,255,.35);} .text-white\/40{color:rgba(255,255,255,.40);}
.text-white\/50{color:rgba(255,255,255,.50);} .text-white\/70{color:rgba(255,255,255,.70);}
.text-white\/80{color:rgba(255,255,255,.80);}
.text-white\/85{color:rgba(255,255,255,.85);}
.text-slate-400{color:#94a3b8;} .text-slate-500{color:#64748b;} .text-slate-600{color:#475569;}
.text-slate-700{color:#334155;} .text-slate-800{color:#1e293b;}
.text-navy-700{color:#2f5597;} .text-navy-900{color:#152548;}
.text-accent-500{color:#f2994a;} .text-accent-600{color:#e08a2e;}
.text-amber-500{color:#f59e0b;} .text-amber-600{color:#d97706;} .text-amber-700{color:#b45309;}
.text-green-600{color:#16a34a;} .text-green-700{color:#15803d;}
.text-red-500{color:#ef4444;} .text-red-600{color:#dc2626;} .text-red-700{color:#b91c1c;}
.text-blue-600{color:#2563eb;} .text-blue-700{color:#1d4ed8;}
.text-orange-700{color:#c2410c;}
.hover\:text-white:hover{color:#fff;} .hover\:text-slate-600:hover{color:#475569;} .hover\:text-slate-700:hover{color:#334155;}

/* Borders / rounded / shadow */
.border{border:1px solid #e2e8f0;} .border-t{border-top:1px solid #e2e8f0;} .border-b{border-bottom:1px solid #e2e8f0;}
.border-slate-100{border-color:#f1f5f9;} .border-slate-200{border-color:#e2e8f0;}
.border-green-100{border-color:#dcfce7;} .border-green-200{border-color:#bbf7d0;}
.border-red-100{border-color:#fee2e2;} .border-red-200{border-color:#fecaca;}
.border-white\/10{border-color:rgba(255,255,255,.1);}
.divide-y>*+*{border-top:1px solid #f1f5f9;}
.divide-slate-100>*+*{border-color:#f1f5f9;} .divide-slate-50>*+*{border-color:#f8fafc;}
.rounded{border-radius:.375rem;} .rounded-lg{border-radius:.5rem;} .rounded-xl{border-radius:.75rem;}
.rounded-2xl{border-radius:1rem;} .rounded-full{border-radius:9999px;}
.shadow-sm{box-shadow:0 1px 2px rgba(0,0,0,.05);}
.shadow-xl{box-shadow:0 20px 25px -5px rgba(0,0,0,.15),0 8px 10px -6px rgba(0,0,0,.1);}
.focus\:outline-none:focus{outline:none;}
.focus\:ring-2:focus{box-shadow:0 0 0 2px rgba(47,85,151,.35);}

/* Componentes reutilizables */
.card{background:#fff;border-radius:1rem;box-shadow:0 1px 2px rgba(0,0,0,.05);border:1px solid #f1f5f9;}
.btn{display:inline-block;border-radius:.75rem;padding:.6rem 1.1rem;font-size:.875rem;font-weight:500;border:none;transition:all .15s;}
.btn-primary{background:#2f5597;color:#fff;} .btn-primary:hover{background:#152548;}
.input{width:100%;border:1px solid #e2e8f0;border-radius:.5rem;padding:.5rem .75rem;font-size:.875rem;}
.input:focus{outline:none;box-shadow:0 0 0 2px rgba(47,85,151,.35);border-color:#2f5597;}
.label{font-size:.75rem;font-weight:500;color:#64748b;}
.badge{font-size:11px;padding:2px 8px;border-radius:9999px;font-weight:600;display:inline-block;}

/* Animación */
.fade-in{animation:fadeIn .25s ease;}
@keyframes fadeIn{from{opacity:0;transform:translateY(4px);}to{opacity:1;transform:none;}}

/* Gallery thumbnail hover */
.gallery-item:hover .gallery-controls{opacity:1;}

/* Sidebar */
.sidebar{width:16rem;background:#152548;color:#fff;flex-shrink:0;display:flex;flex-direction:column;height:100vh;}
.navlink{transition:all .15s ease;display:flex;align-items:center;gap:.75rem;padding:.6rem 1.5rem;font-size:.875rem;color:rgba(255,255,255,.85);}
.navlink:hover{background:rgba(255,255,255,.08);}
.navlink.active{background:rgba(255,255,255,.15);border-left:3px solid #f2994a;}
.navsection{padding:1rem 1.5rem .25rem;font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:rgba(255,255,255,.35);}

/* Tabla */
.tbl{width:100%;font-size:.875rem;}
.tbl thead{background:#f8fafc;color:#64748b;font-size:.75rem;text-transform:uppercase;letter-spacing:.03em;}
.tbl th{text-align:left;padding:.75rem 1.25rem;}
.tbl td{padding:.75rem 1.25rem;}
.tbl tbody tr{border-top:1px solid #f1f5f9;}
.tbl tbody tr:hover{background:#f8fafc;}

/* Modal */
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.4);display:flex;align-items:center;justify-content:center;z-index:50;}
.modal-box{background:#fff;border-radius:1rem;box-shadow:0 20px 25px -5px rgba(0,0,0,.15);width:100%;max-width:32rem;padding:1.5rem;}

/* Progress bar (dashboard) */
.progress-track{width:100%;background:#f1f5f9;border-radius:9999px;height:10px;}
.progress-fill{background:#f2994a;height:10px;border-radius:9999px;}

/* Responsive — móviles */
.mobile-topbar{display:none;}
.sidebar-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0,.45);z-index:45;display:none;}
.tbl-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;}

@media(max-width:767px){
  .sidebar{position:fixed;top:0;left:0;bottom:0;z-index:50;transform:translateX(-100%);transition:transform .22s ease;}
  .sidebar.open{transform:none;box-shadow:12px 0 40px rgba(0,0,0,.35);}
  .sidebar-backdrop.show{display:block;}
  .mobile-topbar{display:flex;align-items:center;justify-content:space-between;gap:.75rem;background:#152548;color:#fff;padding:.6rem .9rem;position:sticky;top:0;z-index:30;}
  .mobile-topbar button{background:transparent;border:none;color:#fff;font-size:1.35rem;line-height:1;padding:.15rem .4rem;}
  .px-8{padding-left:1rem;padding-right:1rem;}
  .py-7{padding-top:1.15rem;padding-bottom:1.15rem;}
  .flex.items-center.justify-between.mb-6{flex-wrap:wrap;gap:.75rem;}
  .grid-cols-3,.grid-cols-4,.grid-cols-5{grid-template-columns:repeat(2,minmax(0,1fr));}
  input,select,textarea{font-size:16px;}
  [id^="modal-"]>div{margin:0 1rem;max-height:calc(100% - 2rem);overflow-y:auto;}
}
