/*
  RIFAS VILLA · ADMIN
  Panel profesional · paleta clara
*/
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
body{
  font-family:'Inter','Helvetica Neue',Arial,sans-serif;
  background:#f4f6f9;color:#1e293b;line-height:1.5;
  -webkit-font-smoothing:antialiased
}
a{color:inherit;text-decoration:none}
button{cursor:pointer;font-family:inherit}
img{max-width:100%;display:block}

/* ─── Login page ─── */
.login-page{
  display:flex;align-items:center;justify-content:center;
  min-height:100vh;background:#f4f6f9;
  background-image:radial-gradient(ellipse at 30% 50%, rgba(184,134,11,.06) 0%, transparent 60%),
    radial-gradient(ellipse at 70% 50%, rgba(30,58,95,.06) 0%, transparent 60%);
}
.login-box{
  background:#fff;border-radius:12px;padding:40px 36px;
  width:380px;max-width:90%;box-shadow:0 4px 24px rgba(0,0,0,.06);
  border:1px solid #e2e8f0;
}
.login-icon{
  width:52px;height:52px;border-radius:12px;
  background:linear-gradient(135deg,#1e3a5f,#b8860b);
  font-size:1.5rem;font-weight:900;color:#fff;
  display:flex;align-items:center;justify-content:center;margin:0 auto 16px;
}
.login-head h1{font-size:1.3rem;font-weight:800;text-align:center;color:#0f1e32}
.login-head p{font-size:.85rem;color:#94a3b8;margin-top:4px;text-align:center}
.login-error{
  background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.2);
  color:#b91c1c;padding:10px 14px;border-radius:6px;font-size:.85rem;margin-bottom:16px;text-align:center
}
.login-field{margin-bottom:14px}
.login-field label{display:block;font-weight:600;font-size:.8rem;color:#475569;margin-bottom:5px}
.login-field input{
  width:100%;padding:10px 14px;border:1px solid #cbd5e1;border-radius:8px;
  font-size:.9rem;font-family:inherit;color:#1e293b;outline:none;transition:border-color .15s;background:#f8fafc
}
.login-field input:focus{border-color:#1e3a5f;box-shadow:0 0 0 3px rgba(30,58,95,.1)}
.login-foot a{font-size:.8rem;color:#94a3b8;transition:color .2s}
.login-foot a:hover{color:#1e3a5f}

/* ─── Buttons ─── */
.btn{
  display:inline-block;padding:10px 20px;border-radius:6px;
  font-weight:600;font-size:.85rem;border:none;cursor:pointer;
  transition:all .15s;text-align:center
}
.btn-primary{background:#1e3a5f;color:#fff;box-shadow:0 2px 4px rgba(30,58,95,.15)}
.btn-primary:hover{background:#152e4d;transform:translateY(-1px)}
.btn-outline{background:transparent;border:1.5px solid #cbd5e1;color:#475569}
.btn-outline:hover{background:#f1f5f9;border-color:#94a3b8}
.btn-full{width:100%}
.btn-sm{padding:5px 14px;font-size:.75rem}
.btn-success{background:#16a34a;color:#fff}
.btn-success:hover{background:#15803d}
.btn-danger{background:#dc2626;color:#fff}
.btn-danger:hover{background:#b91c1c}

/* ─── Layout ─── */
.admin-wrap{display:flex;min-height:100vh}
.admin-sb{
  width:240px;background:#fff;position:fixed;top:0;left:0;bottom:0;
  border-right:1px solid #e2e8f0;z-index:100;display:flex;flex-direction:column;
}
.sb-head{padding:18px 20px;border-bottom:1px solid #e2e8f0}
.sb-logo{display:flex;align-items:center;gap:10px;color:#1e3a5f;font-weight:800;font-size:1.1rem}
.sb-logo img{height:28px;width:auto}
.sb-logo em{font-style:normal;color:#b8860b}
.sb-nav{flex:1;padding:8px;overflow-y:auto}
.sb-link{
  display:flex;align-items:center;gap:10px;padding:10px 14px;
  border-radius:8px;font-size:.85rem;font-weight:600;color:#475569;
  transition:all .15s;margin-bottom:2px
}
.sb-link:hover{background:#f1f5f9;color:#1e3a5f}
.sb-link.active{background:#eff6ff;color:#1e3a5f}
.sb-icon{font-size:1.1rem;width:20px;text-align:center}
.sb-foot{padding:12px 20px;border-top:1px solid #e2e8f0}
.sb-foot a{font-size:.8rem;color:#94a3b8;transition:color .15s}
.sb-foot a:hover{color:#dc2626}

.admin-main{margin-left:240px;flex:1;display:flex;flex-direction:column}
.admin-bar{
  display:flex;justify-content:space-between;align-items:center;
  padding:16px 24px;background:#fff;border-bottom:1px solid #e2e8f0;
}
.admin-bar h2{font-size:1.2rem;font-weight:700}
.admin-body{padding:20px 24px}

/* ─── Dashboard cards ─── */
.dash-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px}
.dash-card{
  background:#fff;border:1px solid #e2e8f0;border-radius:10px;
  padding:20px;text-align:center
}
.dash-num{font-size:2rem;font-weight:900;margin-bottom:4px}
.dash-label{font-size:.75rem;color:#64748b;text-transform:uppercase;letter-spacing:.04em}

/* ─── Sections ─── */
.sec{background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:20px;margin-bottom:20px}
.sec-title{font-size:1rem;font-weight:700;margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid #e2e8f0}
.fin-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.fin-card{background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:16px}
.fin-label{display:block;font-size:.75rem;color:#64748b;text-transform:uppercase;letter-spacing:.04em;margin-bottom:6px}
.fin-val{font-size:1.4rem;font-weight:800;color:#1e3a5f}

/* ─── Tables ─── */
.t-scroll{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:.85rem}
thead th{
  text-align:left;padding:10px 12px;font-size:.75rem;font-weight:600;
  color:#64748b;text-transform:uppercase;letter-spacing:.04em;
  border-bottom:2px solid #e2e8f0;background:#f8fafc
}
tbody td{padding:10px 12px;border-bottom:1px solid #f1f5f9}
tbody tr:hover{background:#f8fafc}

/* ─── Badges ─── */
.badge{
  display:inline-block;padding:3px 10px;border-radius:20px;
  font-size:.72rem;font-weight:600
}
.badge-success{background:#ecfdf5;color:#065f46}
.badge-warning{background:#fffbeb;color:#92400e}
.badge-danger{background:#fef2f2;color:#991b1b}
.badge-secondary{background:#f1f5f9;color:#64748b}

/* ─── Filter tabs ─── */
.filt{display:flex;gap:4px;flex-wrap:wrap}
.filt a{
  padding:5px 14px;border-radius:8px;font-size:.75rem;font-weight:600;
  color:#64748b;text-decoration:none;transition:all .2s;background:#f1f5f9
}
.filt a:hover{background:#e2e8f0;color:#1e293b}
.filt a.active{background:#1e3a5f;color:#fff}

/* ─── Forms ─── */
.form-row{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
.form-row .fld{margin-bottom:0}
.form-row input{padding:9px 12px;border-radius:6px;border:1px solid #cbd5e1;font-size:.85rem;font-family:inherit;color:#1e293b;outline:none;min-width:140px;transition:border-color .2s;background:#f8fafc}
.form-row input:focus{border-color:#1e3a5f;box-shadow:0 0 0 2px rgba(30,58,95,.1)}
.fld{margin-bottom:16px}
.fld label{display:block;font-weight:600;font-size:.78rem;color:#475569;margin-bottom:5px}
.fld input,.fld textarea{
  width:100%;padding:10px 14px;border-radius:8px;
  border:1px solid #cbd5e1;font-size:.9rem;font-family:inherit;color:#1e293b;outline:none;transition:border-color .2s;background:#f8fafc
}
.fld input:focus,.fld textarea:focus{border-color:#1e3a5f;box-shadow:0 0 0 2px rgba(30,58,95,.1)}
.fld textarea{resize:vertical;min-height:80px}
.chk-lbl{display:flex;align-items:center;gap:6px;font-size:.85rem;font-weight:500;cursor:pointer;color:#475569}
.cfg-form{max-width:560px}

/* ─── Alerts ─── */
.alert{padding:12px 16px;border-radius:8px;font-size:.85rem;font-weight:500;margin-bottom:16px}
.alert-success{background:#ecfdf5;border:1px solid #a7f3d0;color:#065f46}
.alert-danger{background:#fef2f2;border:1px solid #fecaca;color:#991b1b}

/* ─── Utils ─── */
.text-muted{color:#94a3b8}
.text-center{text-align:center}
.mt-2{margin-top:1rem}
.cell-actions{white-space:nowrap}
.cell-actions form{display:inline;margin-right:4px}

/* ─── Responsive ─── */
@media(max-width:768px){
  .admin-sb{width:48px}
  .sb-link span:not(.sb-icon){display:none}
  .sb-logo span{display:none}
  .sb-head{padding:12px 8px}
  .sb-nav{padding:4px}
  .sb-link{justify-content:center;padding:10px}
  .admin-main{margin-left:48px}
  .admin-bar{padding:10px 14px;flex-direction:column;gap:8px;align-items:flex-start}
  .admin-bar h2{font-size:1rem}
  .admin-body{padding:12px}
  .dash-grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .dash-card{padding:14px}
  .dash-num{font-size:1.4rem}
  .dash-label{font-size:.7rem}
  .form-row{flex-direction:column;gap:8px}
  .form-row input{min-width:100%;width:100%}
  .filt{overflow-x:auto;flex-wrap:nowrap;padding-bottom:4px}
  .filt a{white-space:nowrap;font-size:.7rem;padding:4px 10px}
  table{font-size:.75rem}
  td,th{padding:6px}
  .btn-sm{padding:4px 8px;font-size:.7rem}
}
@media(max-width:480px){
  .dash-grid{grid-template-columns:1fr;gap:8px}
  .fin-grid{grid-template-columns:1fr;gap:8px}
  .dash-card{padding:12px}
  .sec{padding:14px}
  .sec-title{font-size:.85rem}
  .admin-bar h2{font-size:.9rem}
  table thead{display:none}
  table,tbody,tr,td{display:block;width:100%}
  td{padding:5px 0;border-bottom:1px solid #f1f5f9}
  td:before{content:attr(data-label);font-weight:700;display:block;font-size:.65rem;color:#94a3b8;margin-bottom:2px}
  .t-scroll{overflow:visible}
  .cell-actions{display:flex;gap:4px;flex-wrap:wrap}
}
