
:root{--bg:#060606;--panel:#111;--line:#352b10;--gold:#d8a91d;--gold2:#ffd45b;--green:#49db60;--muted:#999}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 50% -10%,#302507,#090909 38%,#050505);color:#fff;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;min-height:100vh}
.phone{max-width:520px;margin:auto;min-height:100vh;background:#070707e8;padding-bottom:75px}.content{padding:20px}.top{height:68px;padding:0 18px;border-bottom:1px solid #242424;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;background:#080808f5;z-index:4}
.brand{font:900 19px Georgia;color:var(--gold2);letter-spacing:1px;text-align:center}.brand small{display:block;font:9px Arial;letter-spacing:3px;margin-top:3px}.hero{text-align:center;padding:42px 20px 20px}.crest{width:120px;height:120px;border:3px solid var(--gold);border-radius:50%;display:grid;place-items:center;margin:auto;color:var(--gold2);font:900 64px Georgia;box-shadow:0 0 35px #d8a91d33}.hero h1{font:900 30px Georgia;color:var(--gold2);letter-spacing:2px}.hero p{font-size:10px;color:var(--gold2);letter-spacing:3px}
.card{background:linear-gradient(#141414,#0c0c0c);border:1px solid #4b3a10;border-radius:15px;padding:17px;margin-bottom:14px}.grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.stat{min-height:112px;display:flex;flex-direction:column;justify-content:flex-end}.label{font-size:12px;color:#ccc}.big{font-size:23px;font-weight:900;margin-top:7px}.balance{font-size:42px;font-weight:900;color:var(--gold2);margin:8px 0}.green{color:var(--green)}.muted{color:var(--muted);line-height:1.45}
label{display:block;color:var(--gold2);font-size:13px;font-weight:850;margin:17px 0 7px}input,select,textarea{width:100%;padding:14px;border:1px solid #3a3a3a;border-radius:11px;background:#0c0c0c;color:#fff;font-size:16px}textarea{min-height:80px}
button,.btn{width:100%;padding:15px;border-radius:12px;border:0;font-size:16px;font-weight:900;text-align:center;text-decoration:none;display:block;cursor:pointer}.gold{background:linear-gradient(#f4c744,#c88b00);color:#111}.dark{background:#0c0c0c;border:1px solid #5c4711;color:var(--gold2)}.err{color:#ff8b8b;font-size:13px;margin-top:10px;display:none}.ok{color:#6bea7b;font-size:13px;margin-top:10px}
.row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:14px 0;border-bottom:1px solid #292929}.row:last-child{border:0}.small{font-size:12px;color:#aaa;margin-top:3px}.row a{color:var(--gold2)}
.bottom{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(520px,100%);height:70px;background:#080808fa;border-top:1px solid #292929;display:grid;grid-template-columns:repeat(3,1fr)}.bottom a{display:grid;place-items:center;color:#888;text-decoration:none;font-size:11px;text-align:center}.bottom a.active{color:var(--gold2)}
.admin{max-width:1000px;margin:auto;padding:20px}.two{display:grid;grid-template-columns:1fr 1fr;gap:15px}.admin-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.adminstat{background:#131313;border:1px solid #333;border-radius:14px;padding:15px}.adminstat b{display:block;font-size:27px;color:var(--gold2);margin-top:8px}.tablewrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{padding:11px 8px;border-bottom:1px solid #303030;text-align:left;font-size:14px}th{color:#aaa}.hidden{display:none!important}
@media(max-width:700px){.two,.admin-grid{grid-template-columns:1fr}}

/* Panel administrativo móvil */
.admin-head{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:20px}.admin-logout{width:auto;padding:10px 14px}.clients-title{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;margin-bottom:15px}.client-search{max-width:330px;margin:0}.client-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.client-card{background:linear-gradient(180deg,#151515,#0b0b0b);border:1px solid #4b3a10;border-radius:16px;padding:17px}.client-card-top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.client-name{font-size:21px;font-weight:900}.client-id{color:#aaa;font-size:13px;margin-top:5px}.pay-count{white-space:nowrap;border:1px solid #4b3a10;border-radius:999px;padding:6px 9px;color:var(--gold2);font-size:12px}.client-money{margin-top:20px}.client-money span{display:block;color:#aaa;font-size:12px;text-transform:uppercase}.client-money b{display:block;color:var(--gold2);font-size:29px;margin-top:5px}.client-mini{margin-top:10px;color:#aaa;font-size:13px}.client-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:17px}.client-actions .btn{padding:12px 8px;font-size:13px}.detail-head{display:flex;justify-content:space-between;gap:12px;align-items:center}.mini-btn{width:auto;padding:9px 12px}.detail-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:16px}.detail-stat{background:#0b0b0b;border:1px solid #333;border-radius:12px;padding:14px}.detail-stat span{display:block;color:#aaa;font-size:12px}.detail-stat b{display:block;font-size:18px;margin-top:6px}.detail-actions{margin-top:14px;max-width:360px}
@media(max-width:700px){.clients-title{display:block}.client-search{max-width:none;margin-top:14px}.client-cards{grid-template-columns:1fr}.client-card{padding:16px}.client-money b{font-size:31px}.detail-grid{grid-template-columns:1fr 1fr}.detail-actions{max-width:none}.admin-head .brand{font-size:20px!important}.admin{padding:14px}.clients-section{padding:14px}}
@media(max-width:390px){.client-actions{grid-template-columns:1fr}.detail-grid{grid-template-columns:1fr}.client-card-top{display:block}.pay-count{display:inline-block;margin-top:10px}}


/* Producción final: expediente y acciones */
.client-detail{scroll-margin-top:18px}
.detail-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:14px}
.detail-stat{background:#0d0d0d;border:1px solid #332b18;border-radius:13px;padding:14px;min-height:94px}
.detail-stat span{display:block;color:#a8a8a8;font-size:12px;margin-bottom:8px}
.detail-stat b{font-size:20px}
.detail-actions{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:14px}
.history-list{margin-top:14px}
.history-item{display:flex;justify-content:space-between;gap:12px;padding:13px 0;border-bottom:1px solid #292929}
.history-item:last-child{border-bottom:0}
.history-item a{color:var(--gold2);font-weight:800}
.form-note{font-size:12px;color:#999;line-height:1.45;margin-top:8px}
.status-pill{display:inline-flex;align-items:center;gap:6px;border:1px solid #5c4711;color:var(--gold2);border-radius:999px;padding:6px 10px;font-size:12px;font-weight:800}
.status-paid{border-color:#236a31;color:#6bea7b}
.danger{background:#2b0d0d;border:1px solid #7b2323;color:#ff9d9d}
.confirmbox{background:#16120a;border:1px solid #6b5317;border-radius:12px;padding:13px;margin:12px 0}
.admin-section-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
@media(max-width:650px){
  .detail-actions{grid-template-columns:1fr}
  .detail-grid{grid-template-columns:1fr 1fr}
}

/* PASO 6: control de cobros */
.cash-grid{grid-template-columns:repeat(3,1fr)}
.traffic-legend{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin:12px 0 18px;color:#bbb;font-size:13px}.traffic-legend span{display:flex;align-items:center;gap:6px}.traffic-legend b{margin-left:auto;color:#ff9a9a}
.dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:7px;vertical-align:1px}.green-dot{background:#45d15f;box-shadow:0 0 8px #45d15f88}.yellow-dot{background:#ffd34a;box-shadow:0 0 8px #ffd34a88}.red-dot{background:#ff5252;box-shadow:0 0 8px #ff525288}.none-dot{background:#666}
.late-text{color:#ff8585;font-weight:800;font-size:12px;margin-top:7px}.due-soon{color:#ffd45b;font-weight:800;font-size:12px;margin-top:7px}.traffic-red{border-color:#8d2525;color:#ff8f8f}.traffic-yellow{border-color:#8a6b14;color:#ffd45b}.traffic-green{border-color:#246a35;color:#6bea7b}
.whatsapp-btn{background:#153c24;border:1px solid #2b8750;color:#7df0a1}.voided-payment{opacity:.62;text-decoration:none;background:#250b0b;padding-left:8px;padding-right:8px;border-radius:8px}.text-danger{background:none;border:0;color:#ff8585;padding:0;width:auto;display:inline;font-size:12px;font-weight:800}.text-danger:hover{text-decoration:underline}
@media(max-width:700px){.cash-grid{grid-template-columns:1fr 1fr}.traffic-legend b{width:100%;margin-left:0}.client-actions{grid-template-columns:1fr 1fr}.client-actions .whatsapp-btn{grid-column:1/-1}}


/* Panel visual refinado - Sep 2026 */
.admin{max-width:920px}
.admin-head{padding:4px 0 12px;border-bottom:1px solid #5a4310}
.admin-head .brand{font-family:Georgia,serif;font-weight:900;letter-spacing:1.5px;text-shadow:0 1px 18px #d8a91d22}
.card{border-color:#5a4310;box-shadow:0 10px 35px #0006}
.adminstat{background:linear-gradient(145deg,#151515,#090909);border-color:#393939;min-height:142px;display:flex;flex-direction:column;justify-content:center}
.adminstat b{font-size:30px}
.traffic-legend{font-size:14px;padding:2px 0 4px}
.client-card{border-color:#674d0d;box-shadow:inset 0 1px 0 #ffffff05,0 14px 32px #0005}
.client-name{font-size:24px;display:flex;align-items:center}
.client-name .dot{width:13px;height:13px;flex:0 0 13px}
.current-text{color:#6bea7b;font-weight:800;font-size:12px;margin-top:7px}
.client-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:17px}
.client-info{background:#0d0d0d;border:1px solid #332b18;border-radius:12px;padding:12px;min-width:0}
.client-info span{display:block;color:#aaa;font-size:11px;text-transform:uppercase;letter-spacing:.4px}
.client-info b{display:block;font-size:16px;margin-top:6px;color:#fff;overflow-wrap:anywhere}
.client-info small{display:block;color:#aaa;font-size:11px;margin-top:4px}
.client-money{background:linear-gradient(120deg,#15120a,#0d0d0d);border:1px solid #4b3a10;border-radius:13px;padding:13px;margin-top:10px}
.client-money b{font-size:31px}
.client-actions{grid-template-columns:1fr 1fr 1fr}
.client-actions .whatsapp-btn{background:linear-gradient(180deg,#0c7b31,#075923);color:#fff;border-color:#19a64e}
#manualReminderList .history-item{background:#0d0d0d;border:1px solid #2d2d2d;border-radius:12px;padding:12px;margin-bottom:8px}
@media(max-width:700px){
 .admin{padding:12px}
 .admin-head{margin-bottom:14px}
 .admin-grid.cash-grid{grid-template-columns:1fr 1fr}
 .adminstat{min-height:132px}
 .client-actions{grid-template-columns:1fr 1fr}
 .client-actions .whatsapp-btn{grid-column:1/-1}
}
@media(max-width:430px){
 .client-info-grid{grid-template-columns:1fr 1fr}
 .client-info b{font-size:15px}
 .client-money b{font-size:29px}
}

/* Ventanas rápidas de cobros y recordatorios */
.reminder-summary-card{appearance:none;text-align:left;color:#fff;width:100%;font-family:inherit;position:relative;transition:transform .15s ease,border-color .15s ease;background:linear-gradient(145deg,#151515,#090909)}
.reminder-summary-card:hover,.reminder-summary-card:active{transform:translateY(-1px);border-color:#8a6815}
.reminder-summary-card span{font-size:16px;font-weight:500}.reminder-summary-card small{display:block;color:#8f8f8f;font-size:9px;letter-spacing:1.1px;margin-top:7px;font-weight:800}.reminder-summary-card:after{content:'›';position:absolute;right:15px;top:14px;color:var(--gold2);font-size:25px}
.reminder-quick-preview .history-item{align-items:center}
.reminder-modal{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:16px}
.reminder-modal-backdrop{position:absolute;inset:0;background:#000c;backdrop-filter:blur(5px)}
.reminder-modal-panel{position:relative;width:min(680px,100%);max-height:min(86vh,820px);overflow:auto;background:linear-gradient(180deg,#151515,#080808);border:1px solid #76580f;border-radius:20px;padding:18px;box-shadow:0 25px 90px #000;z-index:1}
.reminder-modal-head{display:flex;justify-content:space-between;gap:15px;align-items:flex-start;position:sticky;top:-18px;background:linear-gradient(180deg,#151515 80%,#15151500);padding:18px 0 14px;z-index:3}
.reminder-modal-head .btn{flex:0 0 auto}.reminder-window-list{display:grid;gap:8px;padding-bottom:4px}
.reminder-person{background:#0d0d0d;border:1px solid #333;border-radius:13px;padding:10px 11px}.reminder-person-top{display:flex;justify-content:space-between;gap:9px;align-items:flex-start}.reminder-person h3{font-size:16px;margin:0 0 2px}.reminder-person .small{font-size:10px}.reminder-person .status-pill{font-size:9px;padding:5px 7px}.reminder-person-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:8px}.reminder-person-grid>div{background:#090909;border:1px solid #292929;border-radius:9px;padding:7px 8px}.reminder-person-grid span{display:block;color:#999;font-size:9px;text-transform:uppercase}.reminder-person-grid b{display:block;color:#fff;font-size:13px;margin-top:2px}.reminder-person-actions{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:8px}.reminder-person-actions .btn{padding:9px 6px;font-size:11px}.reminder-toggle-more{width:100%;margin-top:10px;padding:11px;font-size:12px;letter-spacing:.4px}.reminder-empty{text-align:center;padding:35px 12px}.modal-open{overflow:hidden}
@media(max-width:600px){.reminder-modal{align-items:flex-end;padding:0}.reminder-modal-panel{width:100%;max-height:90vh;border-radius:22px 22px 0 0;padding:15px}.reminder-modal-head{top:-15px;padding:15px 0 13px}.reminder-person-actions{grid-template-columns:1fr 1fr}}

/* =========================================================
   OPTIMIZACIÓN ESCRITORIO / TABLET — Sep 2026
   Conserva el diseño móvil y aprovecha pantallas grandes.
   ========================================================= */
@media (min-width: 901px){
  body{background-attachment:fixed}
  .admin{max-width:1440px;padding:28px 34px 52px}
  .admin-head{position:sticky;top:0;z-index:40;background:#080808f2;backdrop-filter:blur(12px);padding:12px 4px 14px;margin-bottom:20px}
  .admin-head .brand{font-size:30px!important}.admin-head .brand small{font-size:10px;letter-spacing:4px}
  .admin-logout{min-width:115px;padding:12px 18px}

  /* Resumen financiero en una fila cuando hay espacio. */
  .cash-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:13px}
  .adminstat{min-height:122px;padding:17px 18px}
  .adminstat b{font-size:27px;line-height:1.05;overflow-wrap:anywhere}

  /* Formularios lado a lado y con ancho cómodo. */
  .two{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:start}
  .two>.card{margin-bottom:0}
  input,select,textarea{font-size:15px}

  /* Clientes: tres columnas en monitor normal. */
  .clients-section{padding:22px}
  .clients-title{align-items:center}
  .client-search{max-width:420px}
  .client-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
  .client-card{padding:15px}
  .client-name{font-size:20px}
  .client-money b{font-size:25px}
  .client-info-grid{gap:8px;margin-top:13px}
  .client-actions{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:13px}
  .client-actions .btn{font-size:11px;padding:10px 6px}
  .client-actions .whatsapp-btn{grid-column:auto}

  /* Expediente completo: 4 métricas por fila. */
  .detail-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}
  .detail-stat{min-height:92px}
  .detail-actions{grid-template-columns:repeat(4,minmax(0,1fr));max-width:none}

  /* Recordatorios: ventana amplia y clientes en dos columnas. */
  .reminder-modal{padding:28px}
  .reminder-modal-panel{width:min(1120px,94vw);max-height:88vh;padding:22px 24px}
  .reminder-modal-head{top:-22px;padding:22px 0 15px}
  .reminder-window-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .reminder-person{padding:11px 12px}
  .reminder-person-actions{grid-template-columns:1fr 1fr}
  .reminder-toggle-more{max-width:360px;margin:14px auto 0}

  /* Historial y seguridad no quedan excesivamente anchos. */
  .history-item{padding:14px 4px}
  .card{border-radius:18px}
}

@media (min-width: 1280px){
  .admin{max-width:1560px}
  .client-cards{grid-template-columns:repeat(4,minmax(0,1fr))}
  .client-card{padding:14px}
  .client-name{font-size:19px}
  .client-money b{font-size:23px}
  .client-info b{font-size:14px}
}

/* Tablet horizontal: dos columnas sin sacrificar botones táctiles. */
@media (min-width: 701px) and (max-width: 900px){
  .admin{max-width:900px;padding:20px 22px}
  .cash-grid{grid-template-columns:repeat(3,1fr)}
  .client-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .detail-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .reminder-modal-panel{width:min(760px,96vw)}
  .reminder-window-list{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* PASO 33 — Inicio más profesional en PC */
.btn.consult{
  background:linear-gradient(180deg,#2563eb,#173ea5);
  border:1px solid #4f83ff;
  color:#fff;
  box-shadow:0 8px 24px rgba(37,99,235,.18);
}
@media(min-width:900px){
  .home-page .phone{
    max-width:1080px;
    min-height:100vh;
    background:transparent;
    padding:46px 34px 60px;
  }
  .home-page .hero{
    padding:18px 20px 34px;
  }
  .home-page .crest{
    width:138px;
    height:138px;
    font-size:72px;
  }
  .home-page .hero h1{
    font-size:38px;
    margin:24px 0 10px;
  }
  .home-page .hero p{
    font-size:12px;
  }
  .home-page .content{
    max-width:900px;
    margin:auto;
    padding:0;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:22px;
    align-items:stretch;
  }
  .home-page .content>.card{
    min-height:205px;
    padding:28px;
    display:flex;
    flex-direction:column;
  }
  .home-page .content>.card h2{
    font-size:24px;
    margin:0 0 8px;
  }
  .home-page .content>.card .muted{
    flex:1;
    font-size:15px;
  }
  .home-page .content>div:last-child{
    grid-column:1/-1;
    margin:6px 0 0!important;
  }
}


/* =========================================================
   PASO 37 — FONDO OFICIAL EN INICIO (MÓVIL + PC)
   ========================================================= */
.home-page{
  min-height:100vh;
  background:#050505;
  position:relative;
  overflow-x:hidden;
}
.home-page::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-2;
  background:
    linear-gradient(rgba(0,0,0,.62),rgba(0,0,0,.82)),
    url("/assets/marquito-inicio.webp") center/cover no-repeat;
  filter:blur(18px);
  transform:scale(1.08);
  opacity:.42;
}
.home-page::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  background:radial-gradient(circle at 50% 20%,rgba(216,169,29,.08),transparent 42%);
  pointer-events:none;
}
.sr-only{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}
.home-shell{
  width:min(1180px,100%);
  min-height:100vh;
  margin:0 auto;
}
.home-visual{
  width:100%;
  aspect-ratio:1/1;
  max-height:620px;
  background:url("/assets/marquito-inicio.webp") center top/contain no-repeat;
}
.home-actions{
  padding:12px 16px 38px;
  display:grid;
  gap:14px;
}
.home-action-card{
  background:linear-gradient(180deg,rgba(18,18,18,.96),rgba(7,7,7,.98));
  border:1px solid #695017;
  border-radius:18px;
  padding:20px;
  box-shadow:0 18px 44px rgba(0,0,0,.48), inset 0 1px 0 rgba(255,255,255,.035);
  backdrop-filter:blur(10px);
}
.home-kicker{
  display:block;
  color:#d9aa27;
  font-size:10px;
  font-weight:900;
  letter-spacing:1.7px;
  margin-bottom:8px;
}
.home-action-card h2{
  margin:0 0 7px;
  font-size:23px;
}
.home-action-card p{
  margin:0 0 18px;
  color:#b7b7b7;
  line-height:1.5;
  font-size:14px;
}
.home-main-btn{
  min-height:54px;
  display:grid;
  place-items:center;
  letter-spacing:.2px;
}
.home-support{
  justify-self:center;
  display:flex;
  align-items:center;
  gap:10px;
  padding:11px 18px;
  border:1px solid #745811;
  border-radius:999px;
  color:#f3c43b;
  background:rgba(8,8,8,.9);
  text-decoration:none;
  box-shadow:0 10px 28px rgba(0,0,0,.35);
}
.home-support .support-icon{font-size:24px;line-height:1}
.home-support b{display:block;font-size:12px;letter-spacing:.8px}
.home-support small{display:block;color:#999;font-size:10px;margin-top:2px}

@media (min-width:900px){
  .home-shell{
    max-width:1240px;
    display:grid;
    grid-template-columns:minmax(0,1.12fr) minmax(390px,.88fr);
    align-items:center;
    gap:34px;
    padding:34px;
  }
  .home-visual{
    max-height:none;
    aspect-ratio:1/1;
    border-radius:28px;
    background-size:contain;
    background-position:center;
    filter:drop-shadow(0 28px 55px rgba(0,0,0,.55));
  }
  .home-actions{
    padding:0;
    align-content:center;
    gap:18px;
  }
  .home-action-card{
    padding:27px 28px;
    border-radius:20px;
  }
  .home-action-card h2{font-size:27px}
  .home-action-card p{font-size:15px}
  .home-main-btn{min-height:58px}
}
@media (max-width:480px){
  .home-visual{max-height:none}
  .home-actions{padding-top:6px}
  .home-action-card{padding:18px}
}
