/* ════ PLEKA APP — app.css v1.1 ════ */
:root{--bg:#faf8f4;--bg2:#f2efe8;--bg3:#e8e4da;--surface:#fff;--ink:#0f0d0a;--muted:#7a7570;--muted2:#a09b95;--border:rgba(0,0,0,.08);--border-mid:rgba(0,0,0,.13);--orange:#e85d20;--orange-l:#f07040;--orange-dim:rgba(232,93,32,.09);--green-l:#40916c;--red:#e63946;--nav-h:60px;}
[data-theme="dark"]{--bg:#0b0b0a;--bg2:#111110;--bg3:#1a1a18;--surface:#161614;--ink:#f0ece3;--muted:#6b6760;--muted2:#504d48;--border:rgba(255,255,255,.07);--border-mid:rgba(255,255,255,.12);--orange-dim:rgba(232,93,32,.13);--green-l:#52b788;}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{font-family:'DM Sans',sans-serif;background:var(--bg);color:var(--ink);transition:background .3s,color .3s;overflow-x:hidden;}
a{color:var(--orange);text-decoration:none;}
a:hover{color:var(--orange-l);}

/* NAV */
.app-nav{position:fixed;top:0;left:0;right:0;height:var(--nav-h);z-index:100;background:var(--surface);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 22px;gap:16px;transition:background .3s,border-color .3s;}
.nav-brand{flex-shrink:0;}
.nav-logo{font-family:'Syne',sans-serif;font-size:1.3rem;font-weight:800;color:var(--ink);letter-spacing:-.5px;}
.nav-logo span{color:var(--orange);}
.nav-links{display:flex;gap:3px;flex:1;}
.nav-link{padding:7px 13px;border-radius:7px;font-size:.83rem;font-weight:500;color:var(--muted);transition:.2s;}
.nav-link:hover,.nav-link.active{background:var(--bg2);color:var(--ink);}
.nav-right{display:flex;align-items:center;gap:9px;margin-left:auto;}
.bell-btn{position:relative;background:var(--bg2);border:1px solid var(--border);border-radius:8px;width:34px;height:34px;cursor:pointer;font-size:.95rem;display:flex;align-items:center;justify-content:center;transition:.2s;}
.bell-btn:hover{border-color:var(--muted);}
.bell-badge{position:absolute;top:-5px;right:-5px;background:var(--orange);color:#fff;font-size:.58rem;font-weight:700;border-radius:50%;width:16px;height:16px;display:flex;align-items:center;justify-content:center;border:2px solid var(--surface);}
.theme-btn{background:var(--bg2);border:1px solid var(--border);border-radius:8px;width:34px;height:34px;cursor:pointer;font-size:.95rem;display:flex;align-items:center;justify-content:center;transition:.2s;color:var(--ink);}
.theme-btn:hover{border-color:var(--muted);}
.nav-user{display:flex;align-items:center;gap:8px;}
.nav-user-name{font-size:.81rem;font-weight:500;color:var(--ink);}
.nav-logout{font-size:.76rem;color:var(--muted);transition:color .2s;}
.nav-logout:hover{color:var(--orange);}

/* REMINDER PANEL */
.reminder-panel{position:fixed;top:var(--nav-h);right:0;width:300px;height:calc(100vh - var(--nav-h));background:var(--surface);border-left:1px solid var(--border);z-index:99;transform:translateX(100%);transition:transform .25s;display:flex;flex-direction:column;box-shadow:-8px 0 30px rgba(0,0,0,.07);}
.reminder-panel.open{transform:translateX(0);}
.rp-header{padding:15px 16px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;}
.rp-title{font-family:'Syne',sans-serif;font-weight:700;font-size:.92rem;color:var(--ink);}
.rp-body{flex:1;overflow-y:auto;padding:11px;}
.rp-item{background:var(--bg2);border:1px solid var(--border);border-radius:8px;padding:10px 12px;margin-bottom:7px;cursor:pointer;transition:border-color .2s;}
.rp-item:hover{border-color:var(--muted);}
.rp-item.overdue{background:rgba(255,184,0,.08);border-color:#fcd34d;}
.rp-item-title{font-size:.81rem;font-weight:500;color:var(--ink);margin-bottom:3px;}
.rp-item-meta{font-size:.7rem;color:var(--muted);}
.rp-empty{text-align:center;padding:36px 16px;color:var(--muted);font-size:.83rem;}

/* FLASH */
.flash{position:fixed;top:calc(var(--nav-h) + 12px);right:16px;z-index:200;padding:10px 16px;border-radius:9px;font-size:.83rem;font-weight:500;display:flex;align-items:center;gap:9px;box-shadow:0 4px 20px rgba(0,0,0,.12);}
.flash button{background:none;border:none;cursor:pointer;margin-left:5px;opacity:.65;}
.flash-success{background:#dcfce7;color:#166534;}
.flash-error{background:#fee2e2;color:#991b1b;}

/* LAYOUT */
.app-layout{display:grid;grid-template-columns:218px 1fr;min-height:calc(100vh - var(--nav-h));margin-top:var(--nav-h);}

/* SIDEBAR */
.sidebar{background:var(--surface);border-right:1px solid var(--border);padding:18px 0;position:sticky;top:var(--nav-h);height:calc(100vh - var(--nav-h));overflow-y:auto;transition:background .3s,border-color .3s;}
.sidebar-section{padding:0 13px 16px;border-bottom:1px solid var(--border);margin-bottom:14px;}
.sidebar-label{font-size:.6rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--muted2);margin-bottom:7px;}
.s-client{display:flex;align-items:center;gap:7px;padding:6px 8px;border-radius:7px;font-size:.82rem;color:var(--ink);transition:.15s;margin-bottom:2px;}
.s-client:hover,.s-client.active{background:var(--orange-dim);}
.s-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;}
.s-count{margin-left:auto;font-size:.68rem;color:var(--muted2);}
.s-add-client{display:flex;align-items:center;gap:6px;padding:6px 8px;font-size:.78rem;color:var(--muted);border:1px dashed var(--border-mid);border-radius:7px;margin-top:6px;transition:.2s;}
.s-add-client:hover{border-color:var(--orange);color:var(--orange);}
.stat-row{display:flex;align-items:center;gap:7px;font-size:.79rem;color:var(--muted);padding:4px 0;}
.stat-row strong{margin-left:auto;color:var(--ink);font-weight:600;}
.stat-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0;}
.dot-borrador{background:var(--muted);}.dot-pendiente{background:var(--orange);}.dot-aprobado{background:var(--green-l);}.dot-rechazado{background:var(--red);}.dot-publicado{background:#2b4d8c;}

/* MAIN */
.main-content{padding:18px 22px;min-width:0;}

/* TOOLBAR */
.cal-toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;flex-wrap:wrap;gap:10px;}
.cal-nav{display:flex;align-items:center;gap:8px;}
.cal-nav-btn{width:28px;height:28px;border-radius:6px;border:1px solid var(--border-mid);background:var(--surface);color:var(--ink);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.92rem;transition:.2s;text-decoration:none;}
.cal-nav-btn:hover{background:var(--ink);color:var(--bg);}
.cal-title{font-family:'Syne',sans-serif;font-size:1.1rem;font-weight:700;color:var(--ink);min-width:170px;text-align:center;}
.cal-toolbar-right{display:flex;gap:9px;align-items:center;}
.form-select-sm{padding:5px 9px;border:1px solid var(--border-mid);border-radius:7px;font-family:'DM Sans',sans-serif;font-size:.79rem;background:var(--surface);color:var(--ink);cursor:pointer;}

/* CALENDAR */
.cal-headers{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;margin-bottom:3px;}
.cal-h{text-align:center;font-size:.63rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted2);padding:4px;}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;}
.cal-cell{background:var(--surface);border:1px solid var(--border);border-radius:8px;min-height:96px;padding:6px;transition:border-color .2s;}
.cal-cell:hover{border-color:var(--muted);}
.cal-cell.other-month{background:var(--bg2);opacity:.5;}
.cal-cell.today{border-color:var(--orange);border-width:2px;}
.cal-day-num{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px;}
.cal-day-num span{font-size:.7rem;font-weight:600;color:var(--muted2);}
.today-circle{background:var(--orange);color:#fff;width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.66rem;font-weight:700;}
.cal-day-actions{display:flex;align-items:center;gap:3px;}
.cal-add-btn{background:none;border:none;color:var(--border-mid);cursor:pointer;font-size:.92rem;line-height:1;transition:color .15s;padding:0;text-decoration:none;}
.cal-cell:hover .cal-add-btn{color:var(--orange);}
.cal-pill{display:flex;align-items:center;gap:3px;padding:3px 5px;border-radius:4px;font-size:.65rem;font-weight:500;margin-bottom:2px;cursor:pointer;transition:opacity .15s;max-width:100%;overflow:hidden;text-decoration:none;}
.cal-pill:hover{opacity:.75;}
.pill-dot{width:5px;height:5px;border-radius:50%;flex-shrink:0;}
.pill-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;}
.pill-nets{font-size:.6rem;flex-shrink:0;}
.cal-more{font-size:.63rem;color:var(--muted2);padding:1px 4px;}

/* ESTADOS */
.estado-borrador{background:rgba(122,117,112,.1);color:var(--muted);}
.estado-pendiente{background:rgba(232,93,32,.1);color:#c84e12;}
.estado-aprobado{background:rgba(64,145,108,.12);color:#2d6a4f;}
.estado-rechazado{background:rgba(230,57,70,.1);color:#c0192a;}
.estado-publicado{background:rgba(43,77,140,.1);color:#2b4d8c;}
.estado-dot-borrador{background:var(--muted);}
.estado-dot-pendiente{background:var(--orange);}
.estado-dot-aprobado{background:var(--green-l);}
.estado-dot-rechazado{background:var(--red);}
.estado-dot-publicado{background:#2b4d8c;}

/* FORMS */
.form-group{margin-bottom:14px;}
.form-label{display:block;font-size:.72rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin-bottom:5px;}
.form-input,.form-select,.form-textarea{width:100%;padding:9px 11px;border:1px solid var(--border-mid);border-radius:7px;font-family:'DM Sans',sans-serif;font-size:.86rem;color:var(--ink);background:var(--surface);transition:border-color .2s;outline:none;}
.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:var(--orange);}
.form-textarea{resize:vertical;min-height:76px;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:13px;}
.network-chips,.type-chips{display:flex;flex-wrap:wrap;gap:6px;}
.net-chip{padding:5px 11px;border-radius:20px;font-size:.77rem;cursor:pointer;border:2px solid transparent;transition:.15s;user-select:none;background:var(--bg2);color:var(--muted);}
.net-chip.selected{border-color:var(--orange);color:var(--orange);background:var(--orange-dim);}
.net-chip input{display:none;}
.net-chip:has(input:checked){border-color:var(--orange)!important;color:var(--orange)!important;background:var(--orange-dim)!important;font-weight:600;}
.status-chips{display:flex;flex-wrap:wrap;gap:6px;}
.status-chip{padding:5px 11px;border-radius:20px;font-size:.77rem;cursor:pointer;border:2px solid transparent;transition:.15s;user-select:none;}
.status-chip.selected{border-color:currentColor;}
.chip-borrador{background:rgba(122,117,112,.1);color:var(--muted);}
.chip-pendiente{background:rgba(232,93,32,.1);color:#c84e12;}
.chip-aprobado{background:rgba(64,145,108,.12);color:#2d6a4f;}
.chip-rechazado{background:rgba(230,57,70,.1);color:#c0192a;}
.chip-publicado{background:rgba(43,77,140,.1);color:#2b4d8c;}

/* BUTTONS */
.btn-primary{background:var(--orange);color:#fff;border:none;padding:10px 20px;border-radius:8px;font-family:'DM Sans',sans-serif;font-size:.86rem;font-weight:500;cursor:pointer;transition:.2s;display:inline-flex;align-items:center;gap:6px;text-decoration:none;}
.btn-primary:hover{background:var(--orange-l);transform:translateY(-1px);}
.btn-primary.btn-block{width:100%;justify-content:center;}
.btn-primary.btn-sm{padding:7px 14px;font-size:.79rem;}
.btn-ghost{background:transparent;color:var(--ink);border:1px solid var(--border-mid);padding:10px 17px;border-radius:8px;font-family:'DM Sans',sans-serif;font-size:.86rem;cursor:pointer;transition:.2s;text-decoration:none;display:inline-flex;align-items:center;gap:6px;}
.btn-ghost:hover{border-color:var(--muted);}
.btn-danger{background:rgba(230,57,70,.09);color:#c0192a;border:none;padding:10px 17px;border-radius:8px;font-family:'DM Sans',sans-serif;font-size:.86rem;cursor:pointer;transition:.2s;}
.btn-danger:hover{background:rgba(230,57,70,.17);}

/* PAGE */
.page-wrap{margin-top:var(--nav-h);padding:28px 36px;max-width:820px;margin-left:auto;margin-right:auto;}
.page-title{font-family:'Syne',sans-serif;font-size:1.45rem;font-weight:700;color:var(--ink);margin-bottom:24px;}
.form-card{background:var(--surface);border:1px solid var(--border);border-radius:13px;padding:26px;margin-bottom:18px;}
.form-card-title{font-family:'Syne',sans-serif;font-size:.97rem;font-weight:700;color:var(--ink);margin-bottom:16px;padding-bottom:11px;border-bottom:1px solid var(--border);}
.form-footer{display:flex;gap:9px;justify-content:flex-end;margin-top:22px;}

/* REMINDER ROWS */
.reminder-rows{display:flex;flex-direction:column;gap:7px;margin-bottom:9px;}
.reminder-row{display:flex;gap:7px;align-items:center;background:var(--bg2);border:1px solid var(--border);border-radius:7px;padding:7px 9px;}
.reminder-row input{flex:1;min-width:0;}
.reminder-row .rem-msg{flex:3;}
.rem-del{background:none;border:none;cursor:pointer;color:var(--muted);font-size:.85rem;transition:.2s;padding:0;flex-shrink:0;}
.rem-del:hover{color:var(--red);}
.btn-add-rem{background:var(--bg2);border:1px dashed var(--border-mid);color:var(--muted);border-radius:7px;padding:6px 13px;font-size:.78rem;cursor:pointer;transition:.2s;font-family:'DM Sans',sans-serif;}
.btn-add-rem:hover{border-color:var(--orange);color:var(--orange);}

/* APROBACIONES */
.aprobaciones-list{display:flex;flex-direction:column;gap:7px;}
.aprob-entry{display:flex;gap:9px;padding:9px;background:var(--bg2);border:1px solid var(--border);border-radius:8px;font-size:.81rem;}
.aprob-ico{font-size:.9rem;flex-shrink:0;}
.aprob-meta{font-size:.69rem;color:var(--muted);margin-top:2px;}
.aprob-comment{margin-top:3px;font-style:italic;color:var(--ink);}

/* CLIENTS INDEX */
.clients-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:13px;margin-top:20px;}
.client-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:18px;transition:.2s,transform .2s;}
.client-card:hover{transform:translateY(-2px);box-shadow:0 4px 18px rgba(0,0,0,.07);}
.client-card-top{display:flex;align-items:center;gap:11px;margin-bottom:12px;}
.client-avatar{width:38px;height:38px;border-radius:50%;flex-shrink:0;}
.client-card-name{font-family:'Syne',sans-serif;font-weight:700;font-size:.97rem;color:var(--ink);}
.client-card-stats{display:flex;gap:14px;font-size:.76rem;color:var(--muted);margin-bottom:14px;flex-wrap:wrap;}
.client-card-actions{display:flex;gap:7px;}

/* LOGIN */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;background:var(--bg);}
.login-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:34px;width:100%;max-width:370px;box-shadow:0 8px 40px rgba(0,0,0,.07);}
.login-logo{font-family:'Syne',sans-serif;font-size:2rem;font-weight:800;color:var(--ink);text-align:center;margin-bottom:5px;}
.login-logo span{color:var(--orange);}
.login-sub{text-align:center;font-size:.83rem;color:var(--muted);margin-bottom:26px;}
.login-form{display:flex;flex-direction:column;gap:4px;}

/* CLIENT PUBLIC — botones de aprobar/rechazar */
.btn-approve{background:rgba(64,145,108,.12);color:#2d6a4f;border:2px solid #40916c;padding:10px 20px;border-radius:8px;font-family:'DM Sans',sans-serif;font-size:.86rem;font-weight:600;cursor:pointer;transition:.2s;}
.btn-approve:hover{background:#40916c;color:#fff;}
.btn-reject{background:rgba(230,57,70,.1);color:#c0192a;border:2px solid var(--red);padding:10px 20px;border-radius:8px;font-family:'DM Sans',sans-serif;font-size:.86rem;font-weight:600;cursor:pointer;transition:.2s;}
.btn-reject:hover{background:var(--red);color:#fff;}

/* RESPONSIVE */
@media(max-width:800px){
  .app-layout{grid-template-columns:1fr;}
  .sidebar{display:none;}
  .main-content{padding:13px 13px;}
  .form-row{grid-template-columns:1fr;}
  .page-wrap{padding:18px 14px;}
  .cal-cell{min-height:68px;}
}