:root{
  --navy:#101C3D;
  --navy-deep:#0A1329;
  --blue:#2454F5;
  --blue-light:#6E8BFF;
  --sky:#EEF2FE;
  --gold:#FF7A45;
  --gold-dark:#E85F2C;
  --gold-soft:#FFEEE5;
  --teal:#0FBF8F;
  --teal-soft:#E7F8EF;
  --ink:#151A2C;
  --ink-soft:#5C6480;
  --ink-faint:#9CA3BD;
  --paper:#F8F9FD;
  --line:#E3E7F5;
  --white:#FFFFFF;
  --success:#1FAE6E;
  --success-soft:#E7F8EF;
  --amber:#E0982A;
  --amber-soft:#FDF3E1;
  --purple:#7C5CDB;
  --purple-soft:#F0ECFB;
  --red:#E14F4F;
  --red-soft:#FBEAEA;
  --grey:#9CA3BD;
  --grey-soft:#EEF0F6;
  --radius:16px;
  --radius-sm:10px;
  --shadow:0 24px 60px -24px rgba(16,28,61,0.30);
  --shadow-sm:0 12px 30px -16px rgba(16,28,61,0.20);
  --shadow-xs:0 2px 8px rgba(16,28,61,0.06);
  --serif:'Sora', sans-serif;
  --sans:'Manrope', sans-serif;
  --display:var(--serif);
  --body:var(--sans);
  --label:var(--sans);
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth; -webkit-font-smoothing:antialiased;}
body{background:var(--paper); color:var(--ink); font-family:var(--sans); font-size:14.5px; line-height:1.6;}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto;} *{animation-duration:0.01ms !important; transition-duration:0.01ms !important;} }
a{color:inherit; text-decoration:none;}
img,svg{display:block;}
button{font-family:inherit; cursor:pointer;}
::selection{background:var(--blue); color:var(--white);}
.container{max-width:1280px; margin:0 auto; padding:0 32px;}
@media (max-width:720px){ .container{padding:0 20px;} }
.icon{width:18px; height:18px; flex-shrink:0;}

.logo{font-family:var(--serif); font-weight:700; font-size:19px; letter-spacing:-0.01em; display:flex; align-items:center; gap:10px; color:var(--navy);}
.logo img{height:40px; width:auto; flex-shrink:0;}

.btn{font-family:var(--sans); font-size:13.8px; font-weight:700; padding:11px 22px; border:1.5px solid var(--line); background:var(--white); color:var(--navy); border-radius:100px; display:inline-flex; align-items:center; gap:8px; transition:all 0.2s ease; white-space:nowrap; box-shadow:var(--shadow-xs);}
.btn:hover{border-color:var(--blue); color:var(--blue); transform:translateY(-1px);}
.btn-solid{background:var(--blue); border-color:var(--blue); color:var(--white); box-shadow:0 14px 26px -10px rgba(36,84,245,.5);}
.btn-solid:hover{background:#1B3FCB; border-color:#1B3FCB; color:var(--white); transform:translateY(-1px);}
.btn-block{width:100%; justify-content:center;}
.btn-sm{padding:8px 16px; font-size:12.5px;}
.btn-danger{border-color:var(--red); color:var(--red); background:var(--white);}
.btn-danger:hover{background:var(--red); color:var(--white); border-color:var(--red);}
.btn-ghost{border-color:transparent; box-shadow:none; color:var(--ink-soft); background:transparent; border-radius:var(--radius-sm);}
.btn-ghost:hover{background:var(--sky); color:var(--blue); border-color:transparent; transform:none;}
.btn .icon{width:15px; height:15px;}

/* ============ Auth ============ */
.auth-shell{min-height:100vh; display:flex; align-items:center; justify-content:center; background:var(--navy-deep); padding:40px 20px; position:relative; overflow:hidden;}
.auth-shell::before{content:""; position:absolute; inset:0;
  background:
    radial-gradient(circle at 12% 15%, rgba(36,84,245,0.30), transparent 42%),
    radial-gradient(circle at 88% 85%, rgba(255,122,69,0.22), transparent 42%);}
.auth-shell::after{content:""; position:absolute; inset:0; opacity:0.5;
  background-image:linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px);
  background-size:44px 44px;}
.auth-card{position:relative; z-index:1; background:var(--white); border-radius:20px; padding:40px 38px; width:100%; max-width:430px; box-shadow:var(--shadow);}
.auth-card .logo{margin-bottom:8px; font-size:20px;}
.auth-card h1{font-family:var(--serif); font-weight:700; font-size:23px; margin:16px 0 6px; letter-spacing:-0.01em; color:var(--navy);}
.auth-card .sub{color:var(--ink-soft); font-size:14px; margin-bottom:24px;}
.auth-foot{text-align:center; font-size:13.5px; color:var(--ink-soft); margin-top:20px;}
.auth-foot a{color:var(--blue); font-weight:700;}
.checkbox-row{display:flex; align-items:center; justify-content:space-between; font-size:13px; color:var(--ink-soft); margin:14px 0 4px;}
.checkbox-row label{display:flex; align-items:center; gap:8px;}
.checkbox-row input{accent-color:var(--blue);}

/* ============ Dashboard shell ============ */
.dash-topbar{position:fixed; top:0; left:0; right:0; height:66px; background:rgba(255,255,255,0.9); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); z-index:150; display:flex; align-items:center; justify-content:space-between; padding:0 22px;}
.topbar-actions{display:flex; align-items:center; gap:14px;}
.icon-btn{position:relative; width:38px; height:38px; border-radius:11px; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; background:var(--white); transition:all 0.15s ease;}
.icon-btn:hover{background:var(--sky); border-color:var(--blue-light);}
.icon-btn .icon{width:17px; height:17px; color:var(--ink-soft);}
.icon-btn .badge{position:absolute; top:-4px; right:-4px; background:var(--gold); color:var(--white); font-size:10px; font-weight:800; width:16px; height:16px; border-radius:50%; display:flex; align-items:center; justify-content:center; border:2px solid var(--white);}
.dash-user{display:flex; align-items:center; gap:9px; font-family:var(--sans); font-size:13.5px; font-weight:700; padding:5px 12px 5px 5px; border-radius:999px; border:1px solid var(--line); background:var(--white);}
.dash-user .av{width:30px; height:30px; border-radius:50%; background:linear-gradient(135deg, var(--blue), var(--gold)); color:var(--white); display:flex; align-items:center; justify-content:center; font-family:var(--serif); font-weight:700; font-size:12px;}
.dash-layout{display:flex; padding-top:66px; min-height:100vh;}
.dash-sidebar{width:236px; flex-shrink:0; background:var(--navy-deep); padding:20px 12px; position:fixed; top:66px; bottom:0; overflow-y:auto; border-right:1px solid rgba(255,255,255,0.06);}
.dash-sidebar h5{font-family:var(--sans); font-size:10px; font-weight:800; letter-spacing:0.08em; text-transform:uppercase; color:#4A5578; margin:18px 14px 8px;}
.dash-sidebar h5:first-child{margin-top:4px;}
.dash-sidebar a{display:flex; align-items:center; gap:11px; font-family:var(--sans); font-size:13.8px; font-weight:600; padding:10px 13px; border-radius:10px; color:#AAB2D0; margin-bottom:1px; transition:all 0.15s ease; position:relative;}
.dash-sidebar a .icon{width:17px; height:17px; opacity:0.85; flex-shrink:0;}
.dash-sidebar a:hover{background:rgba(255,255,255,0.06); color:var(--white);}
.dash-sidebar a[aria-current="page"]{background:rgba(36,84,245,0.22); color:#AFC0FF;}
.dash-sidebar a[aria-current="page"]::before{content:""; position:absolute; left:-12px; top:50%; transform:translateY(-50%); width:3px; height:18px; background:var(--gold); border-radius:0 3px 3px 0;}
.dash-sidebar a[aria-current="page"] .icon{opacity:1;}
/* §5 — Módulos bloqueados: visible pero con diseño diferenciado */
.dash-sidebar a.module-locked{background:rgba(255,255,255,0.02);}
.dash-sidebar a.module-locked .icon{opacity:0.4;}
.dash-sidebar a.module-locked .lock-ic{color:var(--gold);}
.dash-sidebar a.module-locked:hover{background:rgba(255,255,255,0.03); color:#AAB2D0;}
.dash-main{margin-left:236px; flex:1; padding:30px 34px 80px; max-width:1180px;}
@media (max-width:900px){
  .dash-sidebar{transform:translateX(-100%); transition:transform 0.25s ease; z-index:160; width:250px;}
  .dash-sidebar.open{transform:translateX(0);}
  .dash-main{margin-left:0; padding:22px 16px 60px;}
  .dash-burger{display:flex !important;}
}
.dash-burger{display:none; align-items:center; justify-content:center; width:34px; height:34px; border-radius:9px; background:none; border:none;}
.dash-burger .icon{width:20px; height:20px; color:var(--navy);}
.dash-overlay{position:fixed; inset:0; background:rgba(10,19,41,0.5); z-index:155; display:none; backdrop-filter:blur(2px);}
.dash-overlay.open{display:block;}

.dash-head{display:flex; justify-content:space-between; align-items:flex-end; gap:20px; margin-bottom:26px; flex-wrap:wrap;}
.dash-head h1{font-family:var(--serif); font-weight:700; font-size:clamp(22px,3vw,28px); color:var(--navy); letter-spacing:-0.01em;}
.dash-head p{color:var(--ink-soft); font-size:14px; margin-top:4px;}
.breadcrumb{font-family:var(--sans); font-size:12px; color:var(--ink-soft); margin-bottom:14px; font-weight:600;}
.breadcrumb a:hover{color:var(--blue);}

/* Cards */
.dcard{background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:22px; box-shadow:var(--shadow-xs);}
.dcard h3{font-family:var(--serif); font-weight:700; font-size:16px; margin-bottom:14px; color:var(--navy);}
.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
.grid-4{display:grid; grid-template-columns:repeat(4,1fr); gap:16px;}
@media (max-width:900px){ .grid-3{grid-template-columns:repeat(2,1fr);} .grid-4{grid-template-columns:repeat(2,1fr);} }
@media (max-width:640px){ .grid-2,.grid-3,.grid-4{grid-template-columns:1fr;} }

.kpi-card{background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:18px 20px; box-shadow:var(--shadow-xs); display:flex; flex-direction:column; gap:10px;}
.kpi-card .ic{width:36px; height:36px; border-radius:10px; background:var(--sky); color:var(--blue); display:flex; align-items:center; justify-content:center;}
.kpi-card .ic .icon{width:17px; height:17px;}
.kpi-card .lbl{font-family:var(--sans); font-size:12px; color:var(--ink-soft); font-weight:600;}
.kpi-card strong{display:block; font-family:var(--serif); font-weight:700; font-size:27px; color:var(--navy); letter-spacing:-0.01em;}

/* Status pills */
.status-pill{font-family:var(--sans); font-size:11px; font-weight:700; padding:4px 11px; border-radius:100px; display:inline-flex; align-items:center; gap:5px; white-space:nowrap;}
.status-pill::before{content:""; width:6px; height:6px; border-radius:50%; background:currentColor; flex-shrink:0;}
.status-pill.pendiente{background:var(--grey-soft); color:var(--grey);}
.status-pill.preparacion{background:var(--sky); color:var(--blue);}
.status-pill.tramite{background:var(--amber-soft); color:var(--amber);}
.status-pill.revision{background:var(--purple-soft); color:var(--purple);}
.status-pill.finalizado{background:var(--success-soft); color:var(--success);}
.status-pill.accion{background:var(--gold-soft); color:var(--gold-dark);}
.status-pill.pagada{background:var(--success-soft); color:var(--success);}
.status-pill.pendiente-pago{background:var(--amber-soft); color:var(--amber);}
.status-pill.confirmada{background:var(--success-soft); color:var(--success);}
.status-pill.completada{background:var(--grey-soft); color:var(--grey);}
.status-pill.recibido{background:var(--success-soft); color:var(--success);}

/* Tables */
.table-scroll{width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch;}
.data-table{width:100%; border-collapse:collapse; background:var(--white);}
.data-table th{font-family:var(--sans); font-size:11px; text-transform:uppercase; letter-spacing:0.05em; color:var(--ink-soft); text-align:left; padding:11px 16px; border-bottom:1px solid var(--line); white-space:nowrap; font-weight:700;}
.data-table td{padding:14px 16px; border-bottom:1px solid var(--line); font-size:13.8px;}
.data-table tr:last-child td{border-bottom:none;}
.data-table tr:hover td{background:var(--paper);}
.data-table.card{border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-xs);}
@media (max-width:640px){ .data-table{min-width:600px;} }
.row-link{cursor:pointer;}

.toolbar{display:flex; gap:12px; flex-wrap:wrap; align-items:center; margin-bottom:18px; justify-content:space-between;}
.toolbar .left{display:flex; gap:10px; flex-wrap:wrap; align-items:center;}
.search-box{border:1.5px solid var(--line); border-radius:var(--radius-sm); padding:9px 14px; font-family:var(--sans); font-size:13.8px; min-width:220px; background:var(--white);}
.search-box:focus{outline:none; border-color:var(--blue);}
.select-box{border:1.5px solid var(--line); border-radius:var(--radius-sm); padding:9px 12px; font-family:var(--sans); font-size:13.2px; background:var(--white);}

/* Expediente list card */
.exp-card{display:block; background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:18px 20px; margin-bottom:10px; transition:all 0.15s ease; box-shadow:var(--shadow-xs);}
.exp-card:hover{box-shadow:var(--shadow-sm); transform:translateY(-2px); border-color:var(--blue-light);}
.exp-card .top{display:flex; justify-content:space-between; align-items:flex-start; gap:16px; flex-wrap:wrap;}
.exp-card h3{font-family:var(--serif); font-weight:700; font-size:16px; color:var(--navy); letter-spacing:-0.01em;}
.exp-card p{color:var(--ink-soft); font-size:13.2px; margin:6px 0 10px;}
.exp-card .meta{font-family:var(--sans); font-size:11.5px; color:var(--ink-faint);}

/* Timeline */
.timeline{display:flex; flex-direction:column; gap:0; margin-top:6px;}
.tl-step{display:flex; gap:14px; position:relative; padding-bottom:24px;}
.tl-step:last-child{padding-bottom:0;}
.tl-step::before{content:""; position:absolute; left:11px; top:24px; bottom:0; width:2px; background:var(--line);}
.tl-step:last-child::before{display:none;}
.tl-dot{width:23px; height:23px; border-radius:50%; flex-shrink:0; display:flex; align-items:center; justify-content:center; z-index:1;}
.tl-dot .icon{width:12px; height:12px;}
.tl-step.done .tl-dot{background:var(--success); color:var(--white);}
.tl-step.current .tl-dot{background:var(--blue); color:var(--white); box-shadow:0 0 0 4px var(--sky);}
.tl-step.pending .tl-dot{background:var(--paper); color:var(--ink-faint); border:2px solid var(--line);}
.tl-label{font-family:var(--sans); font-weight:700; font-size:14px; padding-top:2px; color:var(--navy);}
.tl-step.pending .tl-label{color:var(--ink-faint); font-weight:600;}
.tl-date{font-family:var(--sans); font-size:11.5px; color:var(--ink-soft); margin-top:2px;}

/* Documents */
.doc-row{display:flex; align-items:center; justify-content:space-between; gap:14px; padding:13px 16px; border:1px solid var(--line); border-radius:var(--radius-sm); margin-bottom:9px; background:var(--white); transition:box-shadow 0.15s ease;}
.doc-row:hover{box-shadow:var(--shadow-xs);}
.doc-row .left{display:flex; align-items:center; gap:12px; min-width:0;}
.doc-ic{width:38px; height:38px; border-radius:10px; background:var(--sky); color:var(--blue); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.doc-ic .icon{width:16px; height:16px;}
.doc-ic.pending{background:var(--gold-soft); color:var(--gold-dark);}
.doc-ic.ok{background:var(--success-soft); color:var(--success);}
.doc-name{font-family:var(--sans); font-weight:700; font-size:13.5px; color:var(--navy);}
.doc-meta{font-family:var(--sans); font-size:11.5px; color:var(--ink-soft);}
.doc-actions{display:flex; gap:6px; flex-shrink:0;}
.doc-actions button, .doc-actions a{background:none; border:1px solid var(--line); border-radius:9px; padding:8px; font-size:13px; color:var(--ink-soft); display:flex; align-items:center; justify-content:center;}
.doc-actions .icon{width:15px; height:15px;}
.doc-actions button:hover, .doc-actions a:hover{background:var(--sky); color:var(--blue);}
.doc-cat-group{margin-bottom:24px;}
.doc-cat-group h4{display:flex; align-items:center; gap:8px; font-family:var(--serif); font-weight:700; font-size:14px; margin-bottom:10px; color:var(--ink-soft);}
.doc-cat-group h4 .icon{width:15px; height:15px;}

/* Messages */
.inbox-list{display:flex; flex-direction:column; gap:1px;}
.inbox-item{display:flex; justify-content:space-between; gap:14px; padding:14px; border-radius:12px; cursor:pointer; transition:background 0.15s ease;}
.inbox-item:hover, .inbox-item.active{background:var(--sky);}
.inbox-item strong{font-family:var(--serif); font-size:14px; font-weight:700; color:var(--navy);}
.inbox-item p{color:var(--ink-soft); font-size:12.5px; margin-top:3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:280px;}
.inbox-item .date{font-family:var(--sans); font-size:11px; color:var(--ink-faint); flex-shrink:0;}
.chat-wrap{display:flex; flex-direction:column; height:500px;}
.chat-messages{flex:1; overflow-y:auto; padding:6px 4px; display:flex; flex-direction:column; gap:12px;}
.chat-bubble{max-width:70%; padding:11px 16px; border-radius:16px; font-size:13.8px; line-height:1.5;}
.chat-bubble.them{background:var(--sky); align-self:flex-start; border-bottom-left-radius:4px; color:var(--ink);}
.chat-bubble.me{background:var(--blue); color:var(--white); align-self:flex-end; border-bottom-right-radius:4px;}
.chat-bubble .time{display:block; font-size:10.5px; opacity:0.65; margin-top:6px;}
.chat-input{display:flex; gap:8px; margin-top:14px; align-items:center;}
.chat-input input{flex:1; border:1.5px solid var(--line); border-radius:100px; padding:11px 18px; font-family:var(--sans); font-size:13.8px;}
.chat-input input:focus{outline:none; border-color:var(--blue);}
.chat-input .icon-b
/* ---------- Mensajes v2: design messagerie moderne (Área Cliente) ---------- */
.msg-app{display:grid; grid-template-columns:350px 1fr; gap:0; background:#fff; border:1.5px solid var(--line); border-radius:22px; overflow:hidden; box-shadow:0 10px 40px rgba(15,23,42,0.07); min-height:640px;}
.msg-side{background:linear-gradient(180deg, #f7faff 0%, #f2f6fd 100%); border-right:1.5px solid var(--line); padding:20px 14px 14px; display:flex; flex-direction:column; gap:12px;}
.msg-side-top{display:flex; align-items:center; justify-content:space-between; padding:0 6px;}
.msg-side-top h2{font-family:var(--serif); font-size:18px; font-weight:800; color:var(--navy); margin:0; letter-spacing:-0.01em;}
.msg-count{font-size:11px; font-weight:800; color:var(--blue); background:rgba(37,99,235,0.1); border-radius:999px; padding:3px 11px;}
.msg-search{display:flex; align-items:center; gap:8px; background:#fff; border:2px solid #c7dbff; border-radius:12px; padding:9px 12px; color:#2563eb;}
.msg-search:focus-within{border-color:#2563eb; box-shadow:0 0 0 4px rgba(37,99,235,0.15);}
.msg-search input{border:none; outline:none; flex:1; font-family:var(--sans); font-size:13px; color:var(--ink); background:transparent;}
.inbox-list{display:flex; flex-direction:column; gap:3px; overflow-y:auto; flex:1; margin:0 -4px; padding:0 4px;}
.inbox-item{display:flex; align-items:center; gap:12px; padding:11px 12px; border-radius:14px; cursor:pointer; border:1.5px solid transparent; transition:background 0.15s ease, border-color 0.15s ease, transform 0.15s ease; position:relative;}
.inbox-item:hover{background:#fff; transform:translateX(2px);}
.inbox-item.active{background:#fff; border-color:#2563eb; box-shadow:0 6px 18px rgba(37,99,235,0.2);}
.inbox-item.active strong{color:#1d4ed8;}
.msg-av{width:42px; height:42px; border-radius:13px; color:#fff; font-weight:800; font-size:12.5px; display:flex; align-items:center; justify-content:center; flex-shrink:0; letter-spacing:0.03em; box-shadow:0 4px 12px rgba(15,23,42,0.2);}
.msg-av.g0{background:linear-gradient(135deg,#1d4ed8,#3b82f6);}
.msg-av.g1{background:linear-gradient(135deg,#6d28d9,#a855f7);}
.msg-av.g2{background:linear-gradient(135deg,#0f766e,#14b8a6);}
.msg-av.g3{background:linear-gradient(135deg,#b45309,#f59e0b);}
.msg-av.g4{background:linear-gradient(135deg,#b91c1c,#ef4444);}
.msg-av-head{width:46px; height:46px; border-radius:14px;}
.inbox-item-body{flex:1; min-width:0;}
.inbox-item-top{display:flex; align-items:baseline; justify-content:space-between; gap:8px;}
.inbox-item strong{font-family:var(--serif); font-size:13.6px; font-weight:700; color:var(--navy); display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.inbox-item p{color:var(--ink-soft); font-size:12.2px; margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.inbox-item .date{font-size:10px; color:var(--ink-faint); flex-shrink:0;}
.msg-unread{min-width:22px; height:22px; border-radius:999px; background:linear-gradient(135deg,#1d4ed8,#3b82f6); color:#fff; font-size:11px; font-weight:800; display:flex; align-items:center; justify-content:center; padding:0 7px; align-self:center; flex-shrink:0; box-shadow:0 3px 10px rgba(29,78,216,0.5);}
.msg-count{font-size:11px; font-weight:800; color:#1d4ed8; background:rgba(37,99,235,0.14); border:1px solid rgba(37,99,235,0.25); border-radius:999px; padding:3px 12px;}
.msg-side-empty{padding:30px 14px; text-align:center; color:var(--ink-soft); font-size:13px;}
.msg-panel{display:flex; flex-direction:column; min-width:0;}
.msg-chat-head{display:flex; align-items:center; gap:14px; padding:16px 22px; border-bottom:1.5px solid var(--line);}
.msg-head-txt strong{font-family:var(--serif); font-size:16px; font-weight:800; color:var(--navy); display:block;}
.msg-head-txt p{font-size:12px; color:var(--ink-faint); margin-top:2px;}
.chat-messages{flex:1; overflow-y:auto; padding:24px 26px; display:flex; flex-direction:column; gap:8px; background:
  radial-gradient(circle at 20% 20%, rgba(37,99,235,0.03) 0%, transparent 40%),
  radial-gradient(circle at 80% 80%, rgba(124,58,237,0.03) 0%, transparent 40%),
  #fbfcfe;}
.chat-bubble{max-width:68%; padding:12px 16px 8px; border-radius:20px; font-size:13.8px; line-height:1.5; position:relative; animation:msgIn 0.25s cubic-bezier(0.2,0.8,0.3,1); word-break:break-word;}
@keyframes msgIn{from{opacity:0; transform:translateY(10px) scale(0.97);} to{opacity:1; transform:translateY(0) scale(1);}}
.chat-bubble.them{background:#eef4ff; border:1.5px solid #c7dbff; align-self:flex-start; border-bottom-left-radius:6px; color:#0f2a5c; box-shadow:0 2px 10px rgba(37,99,235,0.08);}
.chat-bubble.me{background:linear-gradient(135deg,#1d4ed8 0%,#3b82f6 55%,#6366f1 100%); color:#fff; align-self:flex-end; border-bottom-right-radius:6px; box-shadow:0 8px 24px rgba(29,78,216,0.4); border:1px solid rgba(255,255,255,0.18);}
.chat-bubble .time{display:block; font-size:9.5px; opacity:0.75; margin-top:3px; text-align:right;}
.msg-sep{align-self:center; width:56px; height:3px; border-radius:99px; background:var(--line); margin:8px 0; opacity:0.7;}
.composer{display:flex; gap:10px; padding:14px 18px; border-top:1.5px solid var(--line); background:#fff; align-items:center;}
.composer input[type=text]{flex:1; border:2px solid #c7dbff; border-radius:14px; padding:12px 18px; font-family:var(--sans); font-size:13.8px; background:#f0f6ff; transition:border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease; color:#0f2a5c;}
.composer input[type=text]:focus{outline:none; border-color:#2563eb; background:#fff; box-shadow:0 0 0 4px rgba(37,99,235,0.15);}
.composer input[type=text]::placeholder{color:#7d95bd;}
.composer-icon{width:44px; height:44px; border-radius:13px; display:flex; align-items:center; justify-content:center; border:2px solid #c7dbff; background:#fff; cursor:pointer; color:#2563eb; transition:border-color 0.15s ease, color 0.15s ease, background 0.15s ease, transform 0.15s ease;}
.composer-icon:hover{border-color:#2563eb; color:#fff; background:#2563eb; transform:scale(1.05);}
.composer-send{width:48px; height:44px; border-radius:13px; background:linear-gradient(135deg,#1d4ed8 0%,#3b82f6 60%,#6366f1 100%); color:#fff; border:none; display:flex; align-items:center; justify-content:center; cursor:pointer; transition:transform 0.15s ease, box-shadow 0.15s ease, opacity 0.15s ease; box-shadow:0 6px 20px rgba(29,78,216,0.45);}
.composer-send:hover:not(:disabled){transform:translateY(-2px) scale(1.06); box-shadow:0 10px 28px rgba(29,78,216,0.55);}
.composer-send:disabled{opacity:0.3; cursor:not-allowed; box-shadow:none;}
.composer-send.loading{animation:pulse 0.8s ease infinite;}
@keyframes pulse{50%{opacity:0.5;}}
.msg-empty{flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:30px; color:var(--ink-soft);}
.msg-empty svg{opacity:0.3; margin-bottom:14px;}
.msg-empty h3{font-family:var(--serif); font-size:17px; color:var(--navy); margin:0 0 6px;}
.msg-empty p{font-size:13.5px; margin:0; max-width:360px;}
.msg-empty-first{background:#fff; border:1.5px dashed var(--line); border-radius:18px; margin:24px;}
@media (max-width:900px){
  .msg-app{grid-template-columns:1fr; min-height:auto;}
  .msg-side{border-right:none; border-bottom:1.5px solid var(--line); max-height:280px;}
  .chat-messages{min-height:340px;}
}tn{flex-shrink:0;}

/* Notifications */
.notif-item{display:flex; gap:14px; padding:15px 4px; border-bottom:1px solid var(--line);}
.notif-item:last-child{border-bottom:none;}
.notif-item.unread{background:linear-gradient(90deg, var(--sky), transparent 60%);}
.notif-ic{width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.notif-ic .icon{width:15px; height:15px;}
.notif-item p{font-size:13.5px; color:var(--ink);}
.notif-item .date{font-family:var(--sans); font-size:11.5px; color:var(--ink-faint); margin-top:3px;}

/* Appointments */
.appt-card{display:flex; gap:20px; align-items:center; background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:22px; box-shadow:var(--shadow-xs);}
.appt-date{text-align:center; background:var(--navy); color:var(--white); border-radius:12px; padding:11px 16px; flex-shrink:0;}
.appt-date .day{font-family:var(--serif); font-weight:700; font-size:24px; line-height:1;}
.appt-date .month{font-family:var(--sans); font-size:10.5px; text-transform:uppercase; letter-spacing:0.05em;}

/* Forms */
.form-card{border:1px solid var(--line); border-radius:var(--radius); padding:24px; box-shadow:var(--shadow-xs);}
form{display:flex; flex-direction:column;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
@media (max-width:600px){ .form-row{grid-template-columns:1fr;} }
.field{padding:8px 0;}
.field label{display:block; font-family:var(--sans); font-size:11px; font-weight:700; letter-spacing:0.03em; text-transform:uppercase; color:var(--ink-soft); margin-bottom:7px;}
.field input, .field select, .field textarea{width:100%; border:1.5px solid var(--line); border-radius:var(--radius-sm); background:var(--white); padding:11px 14px; font-family:var(--sans); font-size:14px; color:var(--ink); outline:none; resize:none; transition:border-color 0.15s ease;}
.field input:focus, .field select:focus, .field textarea:focus{border-color:var(--blue); box-shadow:0 0 0 3px var(--sky);}
.field.full{grid-column:1/-1;}
.field textarea{min-height:90px;}
form .btn{margin-top:14px; align-self:flex-start;}

/* Toggle switch */
.toggle-row{display:flex; justify-content:space-between; align-items:center; padding:13px 0; border-bottom:1px solid var(--line);}
.toggle-row:last-child{border-bottom:none;}
.toggle-row strong{font-family:var(--sans); font-size:13.8px; display:block; font-weight:700; color:var(--navy);}
.toggle-row span{color:var(--ink-soft); font-size:12.2px;}
.switch{position:relative; width:40px; height:23px; flex-shrink:0;}
.switch input{opacity:0; width:0; height:0;}
.switch .slider{position:absolute; inset:0; background:var(--line); border-radius:999px; transition:0.2s; cursor:pointer;}
.switch .slider::before{content:""; position:absolute; width:17px; height:17px; left:3px; top:3px; background:var(--white); border-radius:50%; transition:0.2s; box-shadow:0 1px 3px rgba(0,0,0,0.2);}
.switch input:checked + .slider{background:var(--blue);}
.switch input:checked + .slider::before{transform:translateX(17px);}

.empty-state{text-align:center; padding:50px 20px; color:var(--ink-soft);}
.empty-state h3{font-family:var(--serif); font-weight:700; font-size:18px; color:var(--navy); margin-bottom:8px;}
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible{outline:2px solid var(--blue); outline-offset:2px;}

/* ============================================================ */
/* MODERN REFINEMENTS (Área Clientes v2)                        */
/* ============================================================ */

/* Topbar search */
.top-search{position:relative; display:flex; align-items:center; min-width:240px; max-width:340px; flex:1;}
.top-search .icon{position:absolute; left:13px; width:16px; height:16px; color:var(--ink-faint); pointer-events:none;}
.top-search input{width:100%; border:1.5px solid var(--line); border-radius:100px; background:var(--white); padding:9px 16px 9px 38px; font-family:var(--sans); font-size:13.5px; color:var(--ink); outline:none; transition:border-color .15s ease, box-shadow .15s ease;}
.top-search input:focus{border-color:var(--blue); box-shadow:0 0 0 3px var(--sky);}
.top-search input::placeholder{color:var(--ink-faint);}
@media (max-width:760px){ .top-search{display:none;} }

/* Search results dropdown */
.search-pop{position:absolute; top:calc(100% + 8px); left:0; right:0; background:var(--white); border:1px solid var(--line); border-radius:14px; box-shadow:var(--shadow-sm); overflow:hidden; z-index:200; max-height:320px; overflow-y:auto;}
.search-pop a{display:flex; justify-content:space-between; align-items:center; gap:10px; padding:11px 16px; font-size:13.2px; border-bottom:1px solid var(--line);}
.search-pop a:last-child{border-bottom:none;}
.search-pop a:hover{background:var(--sky);}
.search-pop .s-type{font-size:10px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; color:var(--blue); background:var(--sky); border-radius:6px; padding:2px 8px; flex-shrink:0;}
.search-pop .s-label{font-weight:600; color:var(--navy); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}

/* Status pill additions (especificación v2) */
.status-pill.aceptado{background:var(--success-soft); color:var(--success);}
.status-pill.rechazado{background:var(--red-soft); color:var(--red);}
.status-pill.en-revision{background:var(--purple-soft); color:var(--purple);}
.status-pill.en-proceso{background:var(--sky); color:var(--blue);}
.status-pill.pendiente-doc{background:var(--amber-soft); color:var(--amber);}
.status-pill.vencida{background:var(--red-soft); color:var(--red);}
.status-pill.cancelada{background:var(--red-soft); color:var(--red);}
.status-pill.reprogramada{background:var(--sky); color:var(--blue);}
.status-pill.enviada{background:var(--grey-soft); color:var(--grey);}
.status-pill.archivado{background:var(--grey-soft); color:var(--grey);}
.status-pill.pendiente-respuesta{background:var(--amber-soft); color:var(--amber);}

/* Section list rows (acciones, actividad, vencimientos) */
.task-row{display:flex; align-items:center; gap:12px; padding:12px 14px; border:1px solid var(--line); border-radius:12px; margin-bottom:8px; background:var(--white); transition:border-color .15s ease, box-shadow .15s ease; text-decoration:none;}
.task-row:hover{border-color:var(--blue-light); box-shadow:var(--shadow-xs);}
.task-row .ic{width:34px; height:34px; border-radius:9px; display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.task-row .ic .icon{width:15px; height:15px;}
.task-row .t-name{font-weight:700; font-size:13.2px; color:var(--navy); line-height:1.35;}
.task-row .t-meta{font-size:11px; color:var(--ink-soft); margin-top:1px;}
.task-row .chev{margin-left:auto; color:var(--ink-faint); flex-shrink:0;}
.task-row .chev .icon{width:14px; height:14px;}

/* Greeting hero */
.greet-hero{position:relative; overflow:hidden; background:linear-gradient(135deg, var(--navy) 0%, #1A2B5F 55%, #24357A 100%); border-radius:20px; padding:30px 32px; margin-bottom:24px; color:var(--white); box-shadow:var(--shadow-sm);}
.greet-hero::after{content:""; position:absolute; inset:0; background:radial-gradient(circle at 85% 20%, rgba(255,122,69,.28), transparent 45%); pointer-events:none;}
.greet-hero h1{font-family:var(--serif); font-weight:700; font-size:clamp(21px,3vw,27px); letter-spacing:-.01em; position:relative; z-index:1;}
.greet-hero p{color:#B9C3E8; font-size:14px; margin-top:5px; position:relative; z-index:1;}
.greet-hero .hero-chips{display:flex; gap:8px; flex-wrap:wrap; margin-top:16px; position:relative; z-index:1;}
.greet-hero .hero-chip{display:inline-flex; align-items:center; gap:7px; background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.14); border-radius:100px; padding:6px 14px; font-size:12px; font-weight:600; color:#DCE3FF;}
.greet-hero .hero-chip .icon{width:13px; height:13px;}
.greet-hero .hero-chip b{color:var(--white);}

/* Vencimientos table rows */
.due-row{display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 0; border-bottom:1px solid var(--line);}
.due-row:last-child{border-bottom:none;}
.due-row .d-date{font-family:var(--serif); font-weight:700; font-size:13px; color:var(--navy); min-width:88px;}
.due-row .d-body{flex:1; min-width:0;}
.due-row .d-type{font-weight:700; font-size:13px; color:var(--navy);}
.due-row .d-docs{font-size:11px; color:var(--ink-soft); margin-top:1px;}

/* Sidebar footer label (Seguridad) */
.dash-sidebar .side-note{margin:14px 14px 6px; padding-top:12px; border-top:1px solid rgba(255,255,255,.08);}

/* Help cards */
.help-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
@media (max-width:860px){ .help-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:600px){ .help-grid{grid-template-columns:1fr;} }
.help-card{background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:22px; box-shadow:var(--shadow-xs); transition:transform .15s ease, box-shadow .15s ease;}
.help-card:hover{transform:translateY(-2px); box-shadow:var(--shadow-sm);}
.help-card .h-ic{width:40px; height:40px; border-radius:11px; background:var(--sky); color:var(--blue); display:flex; align-items:center; justify-content:center; margin-bottom:14px;}
.help-card .h-ic .icon{width:18px; height:18px;}
.help-card h3{font-family:var(--serif); font-weight:700; font-size:15px; color:var(--navy); margin-bottom:8px;}
.help-card p{font-size:12.8px; color:var(--ink-soft); line-height:1.6;}
.help-card details{margin-top:10px;}
.help-card summary{font-weight:700; font-size:12.5px; color:var(--blue); cursor:pointer; list-style:none;}
.help-card summary::-webkit-details-marker{display:none;}
.help-card summary::after{content:" →";}
.help-card details[open] summary::after{content:" ↑";}
.help-card .h-answer{font-size:12.8px; color:var(--ink-soft); margin-top:8px; line-height:1.65; border-left:2px solid var(--sky); padding-left:12px;}

/* Security page */
.sec-row{display:flex; gap:14px; align-items:flex-start; padding:18px; border:1px solid var(--line); border-radius:var(--radius); background:var(--white); box-shadow:var(--shadow-xs); margin-bottom:12px;}
.sec-row .ic{width:40px; height:40px; border-radius:11px; display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.sec-row .ic .icon{width:18px; height:18px;}
.sec-row strong{font-family:var(--serif); font-weight:700; font-size:15px; color:var(--navy); display:block;}
.sec-row p{font-size:12.8px; color:var(--ink-soft); margin-top:3px; line-height:1.6;}
.sec-badge{font-size:10px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; border-radius:6px; padding:3px 9px; margin-left:8px; vertical-align:middle;}
.sec-badge.on{background:var(--success-soft); color:var(--success);}
.sec-badge.soon{background:var(--grey-soft); color:var(--grey);}
.sec-badge.warn{background:var(--amber-soft); color:var(--amber);}
.log-row{display:flex; justify-content:space-between; gap:12px; padding:11px 0; border-bottom:1px solid var(--line); font-size:12.8px;}
.log-row:last-child{border-bottom:none;}
.log-row .l-time{color:var(--ink-faint); flex-shrink:0;}

.msg-supr{
  margin-left:auto;
  width:36px; height:36px;
  border-radius:11px;
  border:1.5px solid transparent;
  background:transparent;
  color:var(--ink-faint, #94a3b8);
  cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:background .15s ease, color .15s ease, border-color .15s ease;
}
.msg-supr:hover{background:#fee2e2; color:#dc2626; border-color:#fecaca;}

/* Mensajes v2: suppression msg par msg (chat-row hover) */
.chat-row{display:flex; align-items:center; gap:7px; max-width:76%;}
.chat-row.me{align-self:flex-end; flex-direction:row-reverse;}
.chat-row.them{align-self:flex-start;}
.chat-row .chat-bubble{max-width:100%;}
.chat-del{
  flex:0 0 auto;
  width:28px; height:28px;
  border-radius:9px;
  border:1.5px solid transparent;
  background:transparent;
  color:#cbd5e1;
  cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  opacity:0;
  transition:opacity .15s ease, background .15s ease, color .15s ease, border-color .15s ease;
}
.chat-row:hover .chat-del{opacity:1;}
.chat-del:hover{background:#fee2e2; color:#dc2626; border-color:#fecaca;}

/* Modale de confirmation suppression: zix 10100 (au-dessus de la fenêtre de msgs) */
.portal-confirm-ov{
  position:fixed; inset:0;
  background:rgba(8,15,30,0.55);
  backdrop-filter:blur(3px);
  display:flex; align-items:center; justify-content:center;
  z-index:10100;
  opacity:0;
  transition:opacity .18s ease;
}
.portal-confirm-ov.open{opacity:1;}
.portal-confirm{
  background:#fff;
  border-radius:20px;
  padding:26px 28px;
  max-width:380px; width:calc(100% - 40px);
  text-align:center;
  box-shadow:0 20px 60px rgba(15,23,42,0.25);
  transform:translateY(14px) scale(0.97);
  transition:transform .18s ease;
  font-family:var(--sans);
}
.portal-confirm-ov.open .portal-confirm{transform:translateY(0) scale(1);}
.portal-confirm .pc-icon{
  width:52px; height:52px;
  margin:0 auto 14px;
  border-radius:16px;
  background:linear-gradient(135deg,#fee2e2,#fecaca);
  color:#dc2626;
  display:flex; align-items:center; justify-content:center;
}
.portal-confirm h3{font-size:16.5px; color:var(--ink, #0f172a); margin:0 0 7px;}
.portal-confirm p{font-size:13.3px; color:var(--ink-faint, #64748b); margin:0 0 20px; line-height:1.5;}
.portal-confirm .pc-actions{display:flex; gap:10px;}
.portal-confirm button{
  flex:1;
  padding:11px 0;
  border-radius:12px;
  border:1.5px solid var(--line, #e2e8f0);
  background:#fff;
  color:var(--ink, #0f172a);
  font-family:var(--sans);
  font-size:13.5px; font-weight:600;
  cursor:pointer;
  transition:background .15s ease, color .15s ease, border-color .15s ease;
}
.portal-confirm .pc-cancel:hover{background:var(--bg-light, #f1f5f9);}
.portal-confirm .pc-ok{
  border-color:transparent;
  background:linear-gradient(135deg,#dc2626,#b91c1c);
  color:#fff;
}
.portal-confirm .pc-ok:hover{filter:brightness(1.08);}

/* ==================================================================
   Mis Citas v2: design professionnel moderne (Área Cliente)
   ================================================================== */
.cita-stats{display:grid; grid-template-columns:repeat(3, 1fr); gap:16px; margin-bottom:22px;}
@media (max-width:700px){ .cita-stats{grid-template-columns:1fr;}}
.cita-stat{
  display:flex; align-items:center; gap:15px;
  background:var(--white);
  border:1px solid var(--line);
  border-radius:18px;
  padding:18px 20px;
  box-shadow:var(--shadow-xs);
  transition:transform .18s ease, box-shadow .18s ease;
}
.cita-stat:hover{transform:translateY(-2px); box-shadow:var(--shadow-sm);}
.cita-stat-ic{
  width:46px; height:46px;
  border-radius:14px;
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
}
.cita-stat-ic svg{width:22px; height:22px;}
.cita-stat strong{font-family:var(--serif); font-size:23px; line-height:1; display:block; color:var(--ink);}
.cita-stat span{font-size:12.2px; color:var(--ink-faint); font-weight:600;}
.cita-stat.st-conf .cita-stat-ic{background:var(--teal-soft); color:var(--teal);}
.cita-stat.st-pend .cita-stat-ic{background:var(--amber-soft); color:var(--amber);}
.cita-stat.st-done .cita-stat-ic{background:var(--sky); color:var(--blue);}

/* Hero: prochaine cita */
.cita-hero{
  display:flex; align-items:center; gap:24px;
  background:linear-gradient(135deg, var(--navy) 0%, var(--navy-deep) 100%);
  border-radius:22px;
  padding:28px 30px;
  color:var(--white);
  box-shadow:var(--shadow);
  position:relative;
  overflow:hidden;
}
.cita-hero::after{
  content:""; position:absolute;
  right:-70px; top:-70px;
  width:220px; height:220px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(36,84,245,0.35), transparent 70%);
  pointer-events:none;
}
.cita-hero-date{
  text-align:center;
  background:rgba(255,255,255,0.12);
  border:1px solid rgba(255,255,255,0.18);
  border-radius:16px;
  padding:13px 18px;
  flex-shrink:0;
  backdrop-filter:blur(4px);
}
.cita-hero-date .d{font-family:var(--serif); font-weight:700; font-size:30px; line-height:1;}
.cita-hero-date .m{font-size:11px; text-transform:uppercase; letter-spacing:0.08em; opacity:0.85; margin-top:3px;}
.cita-hero-date .w{font-size:10px; opacity:0.6; text-transform:capitalize; margin-top:2px;}
.cita-hero-body{flex:1; min-width:0;}
.cita-hero-k{
  display:inline-flex; align-items:center;
  font-size:10.5px; font-weight:700;
  text-transform:uppercase; letter-spacing:0.07em;
  background:rgba(255,122,69,0.2);
  color:#FFB08A;
  padding:4px 11px;
  border-radius:100px;
  margin-bottom:9px;
}
.cita-hero-body h3{font-family:var(--serif); font-size:19px; margin:0 0 5px; color:var(--white);}
.cita-hero-body p{font-size:13.3px; opacity:0.72; margin:0;}
.cita-hero-side{display:flex; flex-direction:column; align-items:flex-end; gap:11px; flex-shrink:0;}

/* Pills de estado (citas) */
.cita-pill{font-size:11px; font-weight:700; padding:4px 12px; border-radius:100px; display:inline-flex; align-items:center; gap:6px; white-space:nowrap;}
.cita-pill::before{content:""; width:6px; height:6px; border-radius:50%; background:currentColor;}
.cita-pill.ok{background:var(--teal-soft); color:var(--teal);}
.cita-pill.pend{background:var(--amber-soft); color:var(--amber);}
.cita-pill.done{background:var(--grey-soft); color:var(--grey);}
.cita-hero .cita-pill.ok{background:rgba(15,191,143,0.22); color:#7DE8C4;}
.cita-hero .cita-pill.pend{background:rgba(224,152,42,0.22); color:#F5C67D;}

/* Botón Ver detalles (hero) */
.cita-btn{
  font-family:var(--sans); font-size:12.6px; font-weight:700;
  padding:9px 18px; border-radius:11px;
  border:none; cursor:pointer;
  transition:background .15s ease, transform .15s ease;
}
.cita-btn.ghost{background:rgba(255,255,255,0.14); color:var(--white); border:1px solid rgba(255,255,255,0.22);}
.cita-btn.ghost:hover{background:rgba(255,255,255,0.24); transform:translateY(-1px);}

/* Historial: timeline rows */
.cita-history-card{
  background:var(--white);
  border:1px solid var(--line);
  border-radius:20px;
  padding:24px 26px;
  margin-top:22px;
  box-shadow:var(--shadow-xs);
}
.cita-history-head{display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:16px;}
.cita-history-head h3{font-family:var(--serif); font-size:16.5px; margin:0 0 3px; color:var(--ink);}
.cita-history-head p{font-size:12.6px; color:var(--ink-faint); margin:0;}
.cita-count{
  font-size:11.6px; font-weight:700;
  background:var(--sky); color:var(--blue);
  padding:5px 13px; border-radius:100px;
  white-space:nowrap;
}
.cita-row{
  display:flex; align-items:center; gap:16px;
  padding:14px 12px;
  border-radius:14px;
  cursor:pointer;
  transition:background .14s ease;
  border-bottom:1px solid var(--line);
}
.cita-row:last-child{border-bottom:none;}
.cita-row:hover{background:var(--paper);}
.cita-row-date{
  width:44px; text-align:center; flex-shrink:0;
  background:var(--paper); border:1px solid var(--line);
  border-radius:11px; padding:7px 0;
}
.cita-row-date strong{display:block; font-family:var(--serif); font-size:16px; line-height:1; color:var(--ink);}
.cita-row-date span{font-size:9.6px; text-transform:uppercase; letter-spacing:0.05em; color:var(--ink-faint); font-weight:700;}
.cita-row-ic{
  width:38px; height:38px; flex-shrink:0;
  border-radius:12px;
  background:var(--sky); color:var(--blue);
  display:flex; align-items:center; justify-content:center;
}
.cita-row-ic svg{width:18px; height:18px;}
.cita-row-body{flex:1; min-width:0;}
.cita-row-body strong{display:block; font-size:13.6px; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.cita-row-body span{font-size:12px; color:var(--ink-faint);}
.cita-row-arrow{color:var(--ink-faint); display:flex; opacity:0; transition:opacity .14s ease;}
.cita-row:hover .cita-row-arrow{opacity:1;}

/* Estado vacío */
.cita-empty{
  text-align:center;
  background:var(--white);
  border:1.5px dashed var(--line);
  border-radius:20px;
  padding:46px 24px;
}
.cita-empty.sm{padding:26px 20px; border-radius:14px; border-style:dashed;}
.cita-empty-ic{
  width:58px; height:58px;
  margin:0 auto 14px;
  border-radius:18px;
  background:var(--sky); color:var(--blue);
  display:flex; align-items:center; justify-content:center;
}
.cita-empty-ic svg{width:26px; height:26px;}
.cita-empty h3{font-family:var(--serif); font-size:16.5px; margin:0 0 6px; color:var(--ink);}
.cita-empty p{font-size:13px; color:var(--ink-faint); margin:0;}

/* Calendario moderno (Mis Citas) */
.cita-cal-card{
  background:var(--white);
  border:1px solid var(--line);
  border-radius:20px;
  padding:22px 24px;
  margin-bottom:22px;
  box-shadow:var(--shadow-xs);
}
.cita-cal-head{display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:16px;}
.cita-cal-head h3{font-family:var(--serif); font-size:16.5px; margin:0 0 3px; color:var(--ink); text-transform:capitalize;}
.cita-cal-head p{font-size:12.6px; color:var(--ink-faint); margin:0;}
.cita-cal-nav{display:flex; gap:7px;}
.cita-cal-btn{
  width:33px; height:33px;
  border-radius:11px;
  border:1px solid var(--line);
  background:var(--paper);
  color:var(--ink-soft);
  cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:background .14s ease, color .14s ease, border-color .14s ease;
}
.cita-cal-btn:hover{background:var(--sky); color:var(--blue); border-color:var(--blue-light);}
.cita-cal-btn.hoy{width:auto; padding:0 15px; font-size:11.8px; font-weight:700; font-family:var(--sans);}
.cita-cal-grid{display:grid; grid-template-columns:repeat(7, 1fr); gap:5px;}
.cita-cal-grid span{
  text-align:center;
  font-size:10.4px; font-weight:700;
  text-transform:uppercase; letter-spacing:0.06em;
  color:var(--ink-faint);
  padding:5px 0;
}
.cita-cal-grid.days{margin-top:4px;}
.cita-cal-day{
  position:relative;
  aspect-ratio:1/0.86;
  border:none;
  border-radius:12px;
  background:transparent;
  font-family:var(--sans);
  cursor:default;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px;
  transition:background .13s ease, box-shadow .13s ease;
}
.cita-cal-day strong{font-size:12.8px; font-weight:600; color:var(--ink-soft); line-height:1;}
.cita-cal-day.other{pointer-events:none;}
.cita-cal-day.today{background:var(--sky); box-shadow:inset 0 0 0 1.5px var(--blue);}
.cita-cal-day.today strong{color:var(--blue); font-weight:700;}
.cita-cal-day.has-ev{background:var(--teal-soft); cursor:pointer;}
.cita-cal-day.has-ev strong{color:var(--teal); font-weight:700;}
.cita-cal-day.has-ev:hover{box-shadow:0 3px 10px -3px rgba(15,191,143,0.45); transform:translateY(-1px);}
.cita-cal-day.has-ev.ev-pend{background:var(--amber-soft);}
.cita-cal-day.has-ev.ev-pend strong{color:var(--amber);}
.cita-cal-day.has-ev.ev-pend:hover{box-shadow:0 3px 10px -3px rgba(224,152,42,0.45);}
.cita-cal-day.today.has-ev{box-shadow:inset 0 0 0 1.5px var(--blue);}
.cita-cal-day .dots{display:flex; gap:3px;}
.cita-cal-day .dot{width:5px; height:5px; border-radius:50%;}
.cita-cal-day .dot.ok{background:var(--teal);}
.cita-cal-day .dot.pend{background:var(--amber);}
.cita-cal-day .dot.done{background:var(--grey);}
.cita-day-row{
  display:flex; align-items:center; gap:13px;
  padding:11px 12px;
  border-radius:13px;
  cursor:pointer;
  transition:background .13s ease;
  border:1px solid var(--line);
}
.cita-day-row:hover{background:var(--paper);}
.cita-day-ic{
  width:36px; height:36px; flex-shrink:0;
  border-radius:11px;
  background:var(--sky); color:var(--blue);
  display:flex; align-items:center; justify-content:center;
}
.cita-day-ic svg{width:17px; height:17px;}
.cita-day-body{flex:1; min-width:0;}
.cita-day-body strong{display:block; font-size:13.2px; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.cita-day-body span{font-size:11.8px; color:var(--ink-faint);}

/* Calendario v3: premium header + refined cells */
.cita-cal-head.premium{margin-bottom:20px;}
.cita-cal-month-card{display:flex; align-items:center; gap:15px;}
.cita-cal-month-badge{
  width:46px; height:46px;
  border-radius:15px;
  background:linear-gradient(135deg, var(--navy) 0%, var(--navy-deep) 100%);
  color:var(--white);
  font-family:var(--serif); font-weight:700; font-size:17px;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 6px 16px -6px rgba(16,28,61,0.4);
  flex-shrink:0;
}
.cita-cal-head.premium h3{font-size:17px; margin:0 0 3px;}
.cita-cal-head.premium p{font-size:12.8px; font-weight:600; color:var(--blue); margin:0;}
.cita-cal-card .cita-cal-grid span{font-size:10.8px; color:var(--ink-faint); padding:7px 0;}
.cita-cal-day{aspect-ratio:1/0.9; border-radius:13px; border:1px solid transparent;}
.cita-cal-day:not(.other):not(.has-ev):hover{background:var(--paper); border-color:var(--line);}
.cita-cal-day:not(.other){cursor:pointer;}
.cita-cal-day strong{font-size:13px;}
.cita-cal-day.has-ev{background:linear-gradient(135deg, var(--teal-soft) 0%, #D4F3E6 100%); border-color:rgba(15,191,143,0.25); box-shadow:0 2px 8px -3px rgba(15,191,143,0.3);}
.cita-cal-day.has-ev:hover{box-shadow:0 6px 16px -5px rgba(15,191,143,0.5); transform:translateY(-2px); border-color:rgba(15,191,143,0.5);}
.cita-cal-day.has-ev.ev-pend{background:linear-gradient(135deg, var(--amber-soft) 0%, #FAE7C8 100%); border-color:rgba(224,152,42,0.25); box-shadow:0 2px 8px -3px rgba(224,152,42,0.3);}
.cita-cal-day.has-ev.ev-pend:hover{box-shadow:0 6px 16px -5px rgba(224,152,42,0.5); border-color:rgba(224,152,42,0.5);}
.cita-cal-day.has-ev .dot{width:6px; height:6px; box-shadow:0 0 0 2px rgba(255,255,255,0.8);}
.cita-cal-day.today{background:var(--white); border-color:var(--blue); box-shadow:inset 0 0 0 1.5px var(--blue), 0 4px 14px -6px rgba(36,84,245,0.4);}
.cita-cal-day.today.has-ev{box-shadow:inset 0 0 0 1.5px var(--blue), 0 4px 14px -6px rgba(36,84,245,0.3);}
.cita-cal-day.today strong{font-weight:700;}

/* Session mobile (Área Cliente): polish bien présente */
.dash-overlay{transition:opacity .22s ease; opacity:0; pointer-events:none;}
.dash-overlay.open{opacity:1; pointer-events:auto;}
@media (max-width:900px){
  .dash-topbar{
    padding:12px 16px;
    gap:10px;
  }
  .dash-sidebar{
    box-shadow:26px 0 60px -20px rgba(10,19,41,0.5);
  }
  .dash-sidebar a{
    padding:12px 14px;
    font-size:14px;
  }
  .dash-head h1{font-size:21px;}
  .dash-head .btn{width:100%; justify-content:center;}
  .dash-user span{display:none;}
  .dcard{padding:18px 16px;}
  .cita-hero{flex-direction:column; align-items:flex-start; gap:18px; padding:22px;}
  .cita-hero-side{flex-direction:row; align-items:center; width:100%; justify-content:space-between;}
  .cita-stats{gap:11px;}
  .cita-stat{padding:14px 16px;}
  .cita-cal-card{padding:16px 14px;}
  .msg-app{grid-template-columns:1fr;}
  .msg-side{max-height:300px; border-right:none; border-bottom:1.5px solid var(--line);}
}
@media (max-width:560px){
  .dash-main{padding:16px 12px 50px;}
  .dash-head h1{font-size:19px;}
  .cita-stats{grid-template-columns:1fr;}
  .cita-row{gap:10px; padding:12px 8px;}
  .cita-row-ic{display:none;}
  .cita-cal-day strong{font-size:11.6px;}
  .msg-chat-head .msg-head-txt p{display:none;}
  .chat-bubble{max-width:88%;}
  .top-search input{font-size:13px;}
}

/* ==================================================================
   Mis Facturas v2: design professionnel moderne (Área Cliente)
   ================================================================== */
/* Hero band */
.inv-hero-band{
  display:flex; align-items:center; justify-content:space-between; gap:26px;
  background:linear-gradient(135deg, var(--navy) 0%, var(--navy-deep) 100%);
  border-radius:22px;
  padding:28px 32px;
  color:var(--white);
  box-shadow:var(--shadow);
  position:relative;
  overflow:hidden;
  margin-bottom:22px;
}
.inv-hero-band::after{
  content:""; position:absolute;
  right:-80px; bottom:-90px;
  width:260px; height:260px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(255,122,69,0.28), transparent 70%);
  pointer-events:none;
}
.inv-hero-k{
  display:inline-flex;
  font-size:10.5px; font-weight:700;
  text-transform:uppercase; letter-spacing:0.08em;
  background:rgba(255,255,255,0.12);
  padding:4px 12px;
  border-radius:100px;
  margin-bottom:10px;
}
.inv-hero-left h3{font-family:var(--serif); font-size:32px; margin:0 0 5px; color:var(--white);}
.inv-hero-left p{font-size:13.3px; opacity:0.72; margin:0 0 14px;}
.inv-progress{width:min(300px, 100%); height:7px; border-radius:100px; background:rgba(255,255,255,0.14); overflow:hidden;}
.inv-progress-bar{height:100%; border-radius:100px; background:linear-gradient(90deg, var(--teal), #6FE3B8); transition:width .6s ease;}
.inv-hero-right{display:flex; gap:14px; flex-shrink:0;}
.inv-hero-stat{
  text-align:center;
  background:rgba(255,255,255,0.1);
  border:1px solid rgba(255,255,255,0.16);
  border-radius:16px;
  padding:15px 22px;
  backdrop-filter:blur(4px);
}
.inv-hero-stat strong{display:block; font-family:var(--serif); font-size:17px; color:#7DE8C4;}
.inv-hero-stat.pend strong{color:#F5C67D;}
.inv-hero-stat.venc strong{color:#F5A0A0;}
.inv-hero-stat span{font-size:11px; opacity:0.7; text-transform:uppercase; letter-spacing:0.05em;}

/* Stats row */
.inv-stats{display:grid; grid-template-columns:repeat(4, 1fr); gap:15px; margin-bottom:22px;}
@media (max-width:900px){ .inv-stats{grid-template-columns:repeat(2, 1fr);}}
@media (max-width:560px){ .inv-stats{grid-template-columns:1fr;}}
.inv-stat{
  display:flex; align-items:center; gap:14px;
  background:var(--white);
  border:1px solid var(--line);
  border-radius:17px;
  padding:16px 18px;
  box-shadow:var(--shadow-xs);
  transition:transform .18s ease, box-shadow .18s ease;
}
.inv-stat:hover{transform:translateY(-2px); box-shadow:var(--shadow-sm);}
.inv-stat-ic{width:42px; height:42px; border-radius:13px; display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.inv-stat-ic.blue{background:var(--sky); color:var(--blue);}
.inv-stat-ic.teal{background:var(--teal-soft); color:var(--teal);}
.inv-stat-ic.amber{background:var(--amber-soft); color:var(--amber);}
.inv-stat-ic.red{background:var(--red-soft); color:var(--red);}
.inv-stat span{display:block; font-size:11.6px; font-weight:600; color:var(--ink-faint); margin-bottom:3px;}
.inv-stat strong{font-family:var(--serif); font-size:16.5px; color:var(--ink); line-height:1;}

/* Toolbar: filtres + compteur */
.inv-toolbar{display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:14px; flex-wrap:wrap;}
.inv-filters{display:flex; gap:8px; flex-wrap:wrap;}
.inv-filter{
  font-family:var(--sans); font-size:12.4px; font-weight:700;
  padding:8px 17px;
  border-radius:100px;
  border:1.5px solid var(--line);
  background:var(--white);
  color:var(--ink-soft);
  cursor:pointer;
  transition:background .14s ease, color .14s ease, border-color .14s ease, box-shadow .14s ease;
}
.inv-filter:hover{border-color:var(--blue-light); color:var(--blue);}
.inv-filter.active{background:var(--navy); border-color:var(--navy); color:var(--white); box-shadow:0 4px 12px -5px rgba(16,28,61,0.45);}
.inv-filter.active.f-pag{background:var(--success); border-color:var(--success); box-shadow:0 4px 12px -5px rgba(31,174,110,0.5);}
.inv-filter.active.f-pend{background:var(--amber); border-color:var(--amber); box-shadow:0 4px 12px -5px rgba(224,152,42,0.5);}
.inv-filter.active.f-venc{background:var(--red); border-color:var(--red); box-shadow:0 4px 12px -5px rgba(225,79,79,0.5);}
.inv-count{font-size:12px; font-weight:700; color:var(--ink-faint);}

/* Liste de factures */
.inv-list{display:flex; flex-direction:column; gap:10px;}
.inv-row{
  display:flex; align-items:center; gap:16px;
  background:var(--white);
  border:1px solid var(--line);
  border-radius:16px;
  padding:15px 19px;
  cursor:pointer;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.inv-row:hover{transform:translateY(-2px); box-shadow:var(--shadow-sm); border-color:var(--blue-light);}
.inv-row-date{
  width:48px; text-align:center; flex-shrink:0;
  background:var(--paper); border:1px solid var(--line);
  border-radius:12px; padding:8px 0;
}
.inv-row-date strong{display:block; font-family:var(--serif); font-size:17px; line-height:1; color:var(--ink);}
.inv-row-date span{font-size:9.4px; text-transform:uppercase; letter-spacing:0.05em; color:var(--ink-faint); font-weight:700; white-space:nowrap;}
.inv-row-ic{
  width:40px; height:40px; flex-shrink:0;
  border-radius:13px;
  background:var(--sky); color:var(--blue);
  display:flex; align-items:center; justify-content:center;
}
.inv-row-body{flex:1; min-width:0;}
.inv-row-body strong{display:block; font-size:13.8px; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.inv-row-body span{font-size:11.8px; color:var(--ink-faint); font-family:var(--serif); letter-spacing:0.02em;}
.inv-row-amount{font-family:var(--serif); font-size:15.5px; font-weight:700; color:var(--ink); white-space:nowrap;}

/* Pills (facturas) */
.inv-pill{font-size:10.8px; font-weight:700; padding:4px 12px; border-radius:100px; white-space:nowrap;}
.inv-pill.ok{background:var(--success-soft); color:var(--success);}
.inv-pill.pend{background:var(--amber-soft); color:var(--amber);}
.inv-pill.venc{background:var(--red-soft); color:var(--red);}

/* Boutons fila */
.inv-btn{
  width:34px; height:34px;
  border-radius:11px;
  border:1.5px solid var(--line);
  background:var(--white);
  color:var(--ink-soft);
  cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:background .14s ease, color .14s ease, border-color .14s ease;
}
.inv-btn svg{width:15px; height:15px;}
.inv-btn:hover{background:var(--sky); color:var(--blue); border-color:var(--blue-light);}
.inv-btn.pay{
  width:auto; padding:0 17px;
  font-family:var(--sans); font-size:12.2px; font-weight:700;
  border-color:transparent;
  background:linear-gradient(135deg, var(--blue), var(--blue-light));
  color:var(--white);
  box-shadow:0 4px 12px -5px rgba(36,84,245,0.5);
}
.inv-btn.pay:hover{filter:brightness(1.08); background:linear-gradient(135deg, var(--blue), var(--blue-light)); color:var(--white);}
.inv-row-actions{display:flex; gap:7px;}
@media (max-width:640px){
  .inv-row{flex-wrap:wrap; gap:11px;}
  .inv-row-body{flex:1 1 calc(100% - 120px);}
  .inv-row-actions{margin-left:auto;}
  .inv-btn.pay{margin-left:0;}
  .inv-hero-band{flex-direction:column; align-items:flex-start; padding:22px;}
  .inv-hero-right{width:100%; justify-content:space-between;}
}

/* État vide */
.inv-empty{
  text-align:center;
  background:var(--white);
  border:1.5px dashed var(--line);
  border-radius:20px;
  padding:46px 24px;
}
.inv-empty-ic{
  width:58px; height:58px;
  margin:0 auto 14px;
  border-radius:18px;
  background:var(--sky); color:var(--blue);
  display:flex; align-items:center; justify-content:center;
}
.inv-empty-ic svg{width:26px; height:26px;}
.inv-empty h3{font-family:var(--serif); font-size:16.5px; margin:0 0 6px; color:var(--ink);}
.inv-empty p{font-size:13px; color:var(--ink-faint); margin:0;}

/* Importar facturas (toolbar) */
.inv-toolbar-right{display:flex; align-items:center; gap:12px;}
.inv-import{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--sans); font-size:12.6px; font-weight:700;
  padding:9px 18px;
  border-radius:12px;
  border:1.5px solid var(--line);
  background:var(--white);
  color:var(--ink-soft);
  cursor:pointer;
  transition:background .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.inv-import svg{width:15px; height:15px;}
.inv-import:hover{
  background:var(--sky);
  color:var(--blue);
  border-color:var(--blue-light);
  box-shadow:0 4px 12px -5px rgba(36,84,245,0.4);
}
@media (max-width:640px){
  .inv-import{width:100%; justify-content:center;}
  .inv-toolbar-right{width:100%; flex-direction:column-reverse; align-items:stretch;}
  .inv-count{text-align:center;}
}

/* ==================================================================
   Mis Expedientes v2: design professionnel moderne (Área Cliente)
   ================================================================== */
/* Hero band */
.exp-hero{
  display:flex; align-items:center; justify-content:space-between; gap:26px;
  background:linear-gradient(135deg, var(--navy) 0%, var(--navy-deep) 100%);
  border-radius:22px;
  padding:28px 32px;
  color:var(--white);
  box-shadow:var(--shadow);
  position:relative;
  overflow:hidden;
  margin-bottom:22px;
}
.exp-hero::after{
  content:""; position:absolute;
  right:-80px; top:-90px;
  width:260px; height:260px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(36,84,245,0.35), transparent 70%);
  pointer-events:none;
}
.exp-hero-k{
  display:inline-flex;
  font-size:10.5px; font-weight:700;
  text-transform:uppercase; letter-spacing:0.08em;
  background:rgba(255,255,255,0.12);
  padding:4px 12px;
  border-radius:100px;
  margin-bottom:10px;
}
.exp-hero-left h3{font-family:var(--serif); font-size:30px; margin:0 0 5px; color:var(--white);}
.exp-hero-left p{font-size:13.3px; opacity:0.72; margin:0 0 14px;}
.exp-progress{width:min(300px, 100%); height:7px; border-radius:100px; background:rgba(255,255,255,0.14); overflow:hidden;}
.exp-progress-bar{height:100%; border-radius:100px; background:linear-gradient(90deg, var(--teal), #6FE3B8); transition:width .6s ease;}
.exp-hero-right{display:flex; gap:14px; flex-shrink:0;}
.exp-hero-stat{
  text-align:center;
  background:rgba(255,255,255,0.1);
  border:1px solid rgba(255,255,255,0.16);
  border-radius:16px;
  padding:15px 22px;
  backdrop-filter:blur(4px);
}
.exp-hero-stat strong{display:block; font-family:var(--serif); font-size:21px; color:#8FA9FF;}
.exp-hero-stat.rev strong{color:#CBB8F5;}
.exp-hero-stat.acc strong{color:#F5A0A0;}
.exp-hero-stat span{font-size:11px; opacity:0.7; text-transform:uppercase; letter-spacing:0.05em;}

/* Toolbar: recherche + filtres pills */
.exp-toolbar{display:flex; align-items:center; gap:14px; margin-bottom:16px; flex-wrap:wrap;}
.exp-search-wrap{position:relative; flex:1; min-width:200px; max-width:320px;}
.exp-search-ic{position:absolute; left:14px; top:50%; transform:translateY(-50%); color:var(--ink-faint); display:flex;}
.exp-search{
  width:100%;
  font-family:var(--sans); font-size:13.4px;
  padding:10px 16px 10px 38px;
  border:1.5px solid var(--line);
  border-radius:12px;
  background:var(--white);
  color:var(--ink);
  transition:border-color .15s ease, box-shadow .15s ease;
}
.exp-search:focus{outline:none; border-color:var(--blue); box-shadow:0 0 0 3px rgba(36,84,245,0.12);}
.exp-search::placeholder{color:var(--ink-faint);}
.exp-filters{display:flex; gap:7px; flex-wrap:wrap;}
.exp-filter{
  font-family:var(--sans); font-size:12.2px; font-weight:700;
  padding:8px 15px;
  border-radius:100px;
  border:1.5px solid var(--line);
  background:var(--white);
  color:var(--ink-soft);
  cursor:pointer;
  transition:background .14s ease, color .14s ease, border-color .14s ease, box-shadow .14s ease;
}
.exp-filter:hover{border-color:var(--blue-light); color:var(--blue);}
.exp-filter.active{background:var(--navy); border-color:var(--navy); color:var(--white); box-shadow:0 4px 12px -5px rgba(16,28,61,0.45);}
.exp-filter.f-accion.active{background:var(--red); border-color:var(--red); box-shadow:0 4px 12px -5px rgba(225,79,79,0.5);}

/* Liste filas */
.exp-list{display:flex; flex-direction:column; gap:10px;}
.exp-row{
  display:flex; align-items:center; gap:16px;
  background:var(--white);
  border:1px solid var(--line);
  border-radius:16px;
  padding:16px 19px;
  text-decoration:none;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.exp-row:hover{transform:translateY(-2px); box-shadow:var(--shadow-sm); border-color:var(--blue-light);}
.exp-row.urgent{border-color:rgba(225,79,79,0.4); background:linear-gradient(90deg, var(--red-soft), var(--white) 40%);}
.exp-row.urgent:hover{border-color:var(--red);}
.exp-row-ic{
  width:44px; height:44px; flex-shrink:0;
  border-radius:14px;
  background:var(--sky); color:var(--blue);
  display:flex; align-items:center; justify-content:center;
}
.exp-row-ic.tramite{background:var(--amber-soft); color:var(--amber);}
.exp-row-ic.revision{background:var(--purple-soft); color:var(--purple);}
.exp-row-ic.accion{background:var(--red-soft); color:var(--red);}
.exp-row-ic.finalizado{background:var(--success-soft); color:var(--success);}
.exp-row-body{flex:1; min-width:0;}
.exp-row-id{font-family:var(--serif); font-size:11.4px; color:var(--ink-faint); letter-spacing:0.03em; display:block; margin-bottom:2px;}
.exp-row-body strong{display:block; font-family:var(--serif); font-size:15.6px; color:var(--navy); letter-spacing:-0.01em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.exp-row-body p{font-size:12.8px; color:var(--ink-soft); margin:3px 0 6px; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden;}
.exp-row-meta{display:flex; align-items:center; gap:8px; font-size:11.4px; color:var(--ink-faint);}
.exp-meta-sep{opacity:0.6;}
.exp-row-side{display:flex; align-items:center; gap:12px; flex-shrink:0;}
.exp-row-arrow{color:var(--ink-faint); display:flex; opacity:0; transition:opacity .15s ease;}
.exp-row:hover .exp-row-arrow{opacity:1;}

/* Pills (expedientes) */
.exp-pill{font-size:10.8px; font-weight:700; padding:4px 12px; border-radius:100px; white-space:nowrap;}
.exp-pill.pend{background:var(--grey-soft); color:var(--grey);}
.exp-pill.prep{background:var(--sky); color:var(--blue);}
.exp-pill.tram{background:var(--amber-soft); color:var(--amber);}
.exp-pill.rev{background:var(--purple-soft); color:var(--purple);}
.exp-pill.done{background:var(--success-soft); color:var(--success);}
.exp-pill.acc{background:var(--red-soft); color:var(--red);}

/* État vide */
.exp-empty{
  text-align:center;
  background:var(--white);
  border:1.5px dashed var(--line);
  border-radius:20px;
  padding:46px 24px;
}
.exp-empty-ic{
  width:58px; height:58px;
  margin:0 auto 14px;
  border-radius:18px;
  background:var(--sky); color:var(--blue);
  display:flex; align-items:center; justify-content:center;
}
.exp-empty-ic svg{width:26px; height:26px;}
.exp-empty h3{font-family:var(--serif); font-size:16.5px; margin:0 0 6px; color:var(--ink);}
.exp-empty p{font-size:13px; color:var(--ink-faint); margin:0;}

/* Mobile */
@media (max-width:640px){
  .exp-hero{flex-direction:column; align-items:flex-start; padding:22px;}
  .exp-hero-right{width:100%; justify-content:space-between;}
  .exp-row{flex-wrap:wrap; gap:12px;}
  .exp-row-body{flex:1 1 calc(100% - 80px);}
  .exp-row-side{width:100%; justify-content:space-between;}
  .exp-filters{overflow-x:auto; flex-wrap:nowrap; width:100%; padding-bottom:4px;}
  .exp-filter{white-space:nowrap;}
}

/* Panel: actualizaciones del gestor (CRM → Área Cliente) */
.exp-crm-panel{
  background:var(--white);
  border:1px solid var(--line);
  border-radius:20px;
  padding:22px 26px;
  margin-top:22px;
  box-shadow:var(--shadow-xs);
  border-left:3px solid var(--blue);
}
.exp-crm-head{display:flex; align-items:center; gap:14px; margin-bottom:16px;}
.exp-crm-badge{
  width:40px; height:40px; flex-shrink:0;
  border-radius:13px;
  background:var(--sky); color:var(--blue);
  display:flex; align-items:center; justify-content:center;
}
.exp-crm-head h3{font-family:var(--serif); font-size:16px; margin:0 0 2px; color:var(--ink);}
.exp-crm-head p{font-size:12.4px; color:var(--ink-faint); margin:0;}
.exp-crm-list{display:flex; flex-direction:column;}
.exp-crm-row{
  display:flex; align-items:flex-start; gap:13px;
  padding:11px 12px;
  border-radius:12px;
  transition:background .13s ease;
}
.exp-crm-row:hover{background:var(--paper);}
.exp-crm-row.fresh{background:linear-gradient(90deg, var(--sky), transparent 70%);}
.exp-crm-dot{
  width:8px; height:8px; flex-shrink:0;
  border-radius:50%;
  background:var(--blue);
  margin-top:6px;
  opacity:0.55;
}
.exp-crm-row.fresh .exp-crm-dot{opacity:1; box-shadow:0 0 0 3px rgba(36,84,245,0.15);}
.exp-crm-body strong{display:block; font-size:13px; color:var(--ink); line-height:1.45; white-space:normal;}
.exp-crm-body span{font-size:11.2px; color:var(--ink-faint); font-weight:600; margin-top:2px; display:block;}
@media (max-width:560px){
  .exp-crm-panel{padding:16px 14px;}
}

/* ==================================================================
   Expediente (détail) v2: hero professionnel + stats + timeline
   ================================================================== */
.edt-hero{
  display:flex; align-items:center; justify-content:space-between; gap:26px;
  background:linear-gradient(135deg, var(--navy) 0%, var(--navy-deep) 100%);
  border-radius:22px;
  padding:28px 32px;
  color:var(--white);
  box-shadow:var(--shadow);
  position:relative;
  overflow:hidden;
  margin-bottom:20px;
}
.edt-hero::after{
  content:""; position:absolute;
  right:-90px; bottom:-100px;
  width:270px; height:270px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(36,84,245,0.32), transparent 70%);
  pointer-events:none;
}
.edt-hero-k{
  display:inline-flex;
  font-family:var(--serif); font-size:11px; font-weight:700;
  letter-spacing:0.05em;
  background:rgba(255,255,255,0.12);
  padding:4px 13px;
  border-radius:100px;
  margin-bottom:10px;
}
.edt-hero-left h1{font-family:var(--serif); font-size:24px; margin:0 0 6px; color:var(--white); letter-spacing:-0.01em;}
.edt-hero-left p{font-size:13.3px; opacity:0.72; margin:0 0 12px; line-height:1.5;}
.edt-hero-meta{display:flex; align-items:center; gap:9px; font-size:11.8px; font-weight:600; opacity:0.75;}
.edt-meta-sep{opacity:0.6;}
.edt-hero-side{display:flex; flex-direction:column; align-items:flex-end; gap:13px; flex-shrink:0;}
.edt-hero .status-pill{font-size:12px; padding:5px 15px;}
.edt-btn{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--sans); font-size:12.6px; font-weight:700;
  padding:9px 18px;
  border-radius:11px;
  background:rgba(255,255,255,0.14);
  border:1px solid rgba(255,255,255,0.22);
  color:var(--white);
  text-decoration:none;
  transition:background .15s ease;
}
.edt-btn:hover{background:rgba(255,255,255,0.26);}

/* Banner: requiere acción */
.edt-banner{
  display:flex; align-items:center; gap:15px;
  background:var(--gold-soft);
  border:1.5px solid var(--gold);
  border-radius:16px;
  padding:16px 20px;
  margin-bottom:18px;
}
.edt-banner-ic{
  width:42px; height:42px; flex-shrink:0;
  border-radius:13px;
  background:rgba(255,122,69,0.2);
  color:var(--gold-dark);
  display:flex; align-items:center; justify-content:center;
}
.edt-banner strong{display:block; color:var(--gold-dark); font-size:12.6px; text-transform:uppercase; letter-spacing:0.05em; margin-bottom:2px;}
.edt-banner div:not(.edt-banner-ic){font-size:13.4px; color:var(--ink);}

/* Stats row */
.edt-stats{display:grid; grid-template-columns:repeat(3, 1fr); gap:15px; margin-bottom:20px;}
@media (max-width:640px){ .edt-stats{grid-template-columns:1fr;}}
.edt-stat{
  background:var(--white);
  border:1px solid var(--line);
  border-radius:16px;
  padding:15px 19px;
  box-shadow:var(--shadow-xs);
}
.edt-stat-top{display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-bottom:8px;}
.edt-stat-top span{font-size:11.4px; font-weight:700; color:var(--ink-faint); text-transform:uppercase; letter-spacing:0.04em;}
.edt-stat-top strong{font-family:var(--serif); font-size:19px; color:var(--ink);}
.edt-stat-sub{font-size:11px; color:var(--ink-faint); font-weight:600;}
.edt-progress{height:7px; border-radius:100px; background:var(--paper); overflow:hidden;}
.edt-progress-bar{height:100%; border-radius:100px; background:linear-gradient(90deg, var(--teal), #6FE3B8); transition:width .6s ease;}

/* Cards: encabezados con iconos */
.edt-card{border-radius:18px; padding:20px 22px;}
.edt-card-h{display:flex; align-items:center; gap:10px; font-family:var(--serif); font-size:15px; color:var(--ink); margin:0 0 16px;}
.edt-card-ic{
  width:31px; height:31px;
  border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
}
.edt-card-ic.blue{background:var(--sky); color:var(--blue);}
.edt-card-ic.teal{background:var(--teal-soft); color:var(--teal);}
.edt-card-ic.purple{background:var(--purple-soft); color:var(--purple);}
.edt-card-count{
  margin-left:auto;
  font-family:var(--sans); font-size:11px; font-weight:700;
  background:var(--paper); color:var(--ink-soft);
  padding:3px 11px;
  border-radius:100px;
}
.edt-empty{color:var(--ink-faint); font-size:13.2px;}
@media (max-width:640px){
  .edt-hero{flex-direction:column; align-items:flex-start; padding:22px;}
  .edt-hero-side{flex-direction:row; width:100%; justify-content:space-between; align-items:center;}
}

/* Actividad del gestor (CRM): acciones colóreas + badges + filtros */
.act-filters{display:flex; gap:7px; flex-wrap:wrap; margin-bottom:14px;}
.act-filter{
  font-family:var(--sans); font-size:11.8px; font-weight:700;
  padding:6px 14px;
  border-radius:100px;
  border:1.5px solid var(--line);
  background:var(--white);
  color:var(--ink-soft);
  cursor:pointer;
  display:inline-flex; align-items:center; gap:6px;
  transition:background .14s ease, color .14s ease, border-color .14s ease;
}
.act-filter:hover{border-color:var(--blue-light); color:var(--blue);}
.act-filter.active{background:var(--navy); border-color:var(--navy); color:var(--white);}
.act-cnt{
  font-size:9.6px; font-weight:800;
  background:var(--paper); color:var(--ink-soft);
  padding:1px 7px;
  border-radius:100px;
}
.act-filter.active .act-cnt{background:rgba(255,255,255,0.2); color:var(--white);}
.act-list{display:flex; flex-direction:column; gap:6px;}
.act-row{
  display:flex; align-items:flex-start; gap:13px;
  padding:11px 12px;
  border-radius:13px;
  border:1px solid var(--line);
  background:var(--white);
  transition:transform .15s ease, box-shadow .15s ease;
}
.act-row:hover{transform:translateX(3px); box-shadow:var(--shadow-xs);}
.act-ic{
  width:36px; height:36px; flex-shrink:0;
  border-radius:12px;
  display:flex; align-items:center; justify-content:center;
}
.act-ic.alta{background:var(--teal-soft); color:var(--teal);}
.act-ic.actualiza{background:var(--purple-soft); color:var(--purple);}
.act-ic.avance{background:var(--sky); color:var(--blue);}
.act-ic.otra{background:var(--grey-soft); color:var(--grey);}
.act-body{flex:1; min-width:0;}
.act-top{display:flex; align-items:flex-start; justify-content:space-between; gap:10px; flex-wrap:wrap;}
.act-body strong{font-size:13px; color:var(--ink); line-height:1.45; white-space:normal; font-weight:600;}
.act-badge{
  font-size:9.6px; font-weight:800;
  padding:3px 11px;
  border-radius:100px;
  white-space:nowrap;
  text-transform:uppercase;
  letter-spacing:0.04em;
}
.act-badge.alta{background:var(--teal-soft); color:var(--teal);}
.act-badge.actualiza{background:var(--purple-soft); color:var(--purple);}
.act-badge.avance{background:var(--sky); color:var(--blue);}
.act-badge.otra{background:var(--grey-soft); color:var(--grey);}
.act-when{font-size:11px; color:var(--ink-faint); font-weight:600; margin-top:3px; display:block;}
.act-empty{color:var(--ink-faint); font-size:12.6px; text-align:center; padding:18px 0;}
@media (max-width:560px){
  .act-row{gap:10px; padding:10px 9px;}
  .act-top{flex-direction:column; align-items:flex-start; gap:5px;}
}

.act-ic.elimina{background:var(--red-soft); color:var(--red);}
.act-badge.elimina{background:var(--red-soft); color:var(--red);}

/* ===== Documentos v2 : hero / stats / toolbar / pills / rows ===== */
.doc-hero{display:flex; align-items:center; justify-content:space-between; gap:24px; padding:26px 30px; border-radius:var(--radius); background:linear-gradient(115deg, #0f2a1e 0%, #16402c 55%, #1b5236 100%); color:#f3f7f2; margin-bottom:22px; position:relative; overflow:hidden;}
.doc-hero::after{content:""; position:absolute; right:-70px; top:-70px; width:240px; height:240px; border-radius:50%; background:radial-gradient(circle, rgba(255,255,255,0.10), transparent 70%);}
.doc-hero-left{min-width:0;}
.doc-hero-k{display:inline-flex; align-items:center; gap:6px; font-size:11px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:#a9d3b6; margin-bottom:8px;}
.doc-hero-left h3{font-family:var(--serif); font-size:24px; font-weight:700; margin-bottom:6px; color:#ffffff;}
.doc-hero-left p{font-size:13px; color:#cfe3d2; margin:0;}
.doc-hero-right{display:flex; gap:14px; flex-shrink:0;}
.doc-hero-stat{min-width:92px; padding:12px 16px; border-radius:var(--radius-sm); background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.14); display:flex; flex-direction:column; align-items:center; gap:2px;}
.doc-hero-stat strong{font-size:20px; font-weight:800; color:#ffffff; line-height:1;}
.doc-hero-stat span{font-size:11px; color:#cfe3d2; white-space:nowrap;}
.doc-stats{display:grid; grid-template-columns:repeat(4, 1fr); gap:14px; margin-bottom:22px;}
.doc-stat{display:flex; align-items:center; gap:12px; padding:16px 18px; background:var(--white); border:1px solid var(--line); border-radius:var(--radius-sm); transition:box-shadow 0.15s ease;}
.doc-stat:hover{box-shadow:var(--shadow-xs);}
.doc-stat-ic{width:40px; height:40px; border-radius:var(--radius-sm); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.doc-stat-ic svg{width:19px; height:19px;}
.doc-stat-ic.blue{background:#eaf1fb; color:#2563eb;}
.doc-stat-ic.purple{background:#f3eefc; color:#7c3aed;}
.doc-stat-ic.amber{background:#fdf3e0; color:#d97706;}
.doc-stat-ic.teal{background:#e6f6f4; color:#0d9488;}
.doc-stat > div{display:flex; flex-direction:column;}
.doc-stat span{font-size:11px; color:var(--ink-soft); font-weight:600;}
.doc-stat strong{font-size:18px; font-weight:800; color:var(--ink); line-height:1.1;}
.doc-toolbar{display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:20px;}
.doc-search-wrap{position:relative; flex:1; min-width:240px; max-width:360px;}
.doc-search-ic{position:absolute; left:12px; top:50%; transform:translateY(-50%); color:var(--ink-soft); display:flex;}
.doc-search-ic svg{width:16px; height:16px;}
.doc-search{width:100%; padding:11px 14px 11px 36px; border:1px solid var(--line); border-radius:var(--radius-sm); background:var(--white); font-size:13px; color:var(--ink); outline:none; transition:border-color 0.15s ease;}
.doc-search:focus{border-color:#16402c;}
.doc-filters{display:flex; gap:8px; flex-wrap:wrap;}
.doc-filter{padding:8px 15px; border-radius:999px; border:1px solid var(--line); background:var(--white); font-size:12px; font-weight:600; color:var(--ink-soft); cursor:pointer; transition:all 0.15s ease;}
.doc-filter:hover{border-color:#16402c; color:#16402c;}
.doc-filter.active{background:#16402c; border-color:#16402c; color:#ffffff;}
.doc-empty{display:flex; flex-direction:column; align-items:center; gap:10px; padding:56px 20px; background:var(--white); border:1px dashed var(--line); border-radius:var(--radius-sm); text-align:center;}
.doc-empty-ic{width:46px; height:46px; border-radius:var(--radius-sm); background:#f0f5f1; color:#16402c; display:flex; align-items:center; justify-content:center;}
.doc-empty-ic svg{width:22px; height:22px;}
.doc-empty h3{font-family:var(--serif); font-size:16px; font-weight:700; margin:0;}
.doc-empty p{font-size:12px; color:var(--ink-soft); margin:0;}
.doc-cat-group{margin-bottom:26px;}
.doc-cat-h{display:flex; align-items:center; gap:10px; font-family:var(--serif); font-weight:700; font-size:14px; margin-bottom:12px; color:var(--ink);}
.doc-cat-ic{width:26px; height:26px; border-radius:var(--radius-sm); display:flex; align-items:center; justify-content:center;}
.doc-cat-ic svg{width:14px; height:14px;}
.doc-cat-ic.blue{background:#eaf1fb; color:#2563eb;}
.doc-cat-ic.purple{background:#f3eefc; color:#7c3aed;}
.doc-cat-ic.amber{background:#fdf3e0; color:#d97706;}
.doc-cat-ic.teal{background:#e6f6f4; color:#0d9488;}
.doc-cat-ic.red{background:#fdeaea; color:#dc2626;}
.doc-cat-ic.grey{background:#f1f3f2; color:#6b7280;}
.doc-cat-count{margin-left:auto; font-family:var(--sans); font-size:11px; font-weight:700; color:var(--ink-soft); background:#f1f3f2; border-radius:999px; padding:3px 10px;}
.doc-row2{display:flex; align-items:center; gap:14px; padding:14px 16px; background:var(--white); border:1px solid var(--line); border-radius:var(--radius-sm); margin-bottom:10px; transition:box-shadow 0.15s ease, border-color 0.15s ease;}
.doc-row2:hover{box-shadow:var(--shadow-xs); border-color:#d8e2da;}
.doc-row2-ic{width:38px; height:38px; border-radius:var(--radius-sm); background:#f0f5f1; color:#16402c; display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.doc-row2-ic svg{width:18px; height:18px;}
.doc-row2-body{min-width:0; flex:1;}
.doc-row2-body strong{display:block; font-size:13px; font-weight:700; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.doc-row2-body span{display:block; font-size:11px; color:var(--ink-soft); margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.doc-pill{flex-shrink:0; font-size:10px; font-weight:700; letter-spacing:0.05em; text-transform:uppercase; border-radius:999px; padding:5px 12px;}
.doc-pill.ok{background:#e5f4ea; color:#15803d;}
.doc-pill.rec{background:#eaf1fb; color:#1d4ed8;}
.doc-pill.rev{background:#fdf3e0; color:#b45309;}
.doc-pill.pend{background:#fdeaea; color:#b91c1c;}
.doc-row2-actions{display:flex; gap:7px; flex-shrink:0;}
.doc-btn{width:32px; height:32px; border-radius:var(--radius-sm); border:1px solid var(--line); background:var(--white); color:var(--ink-soft); display:flex; align-items:center; justify-content:center; cursor:pointer; transition:all 0.15s ease;}
.doc-btn svg{width:15px; height:15px;}
.doc-btn:hover{border-color:#16402c; color:#16402c; background:#f0f5f1;}
@media (max-width:860px){
  .doc-hero{flex-direction:column; align-items:flex-start;}
  .doc-stats{grid-template-columns:repeat(2, 1fr);}
  .doc-row2 .doc-pill{display:none;}
}
@media (max-width:560px){
  .doc-stats{grid-template-columns:1fr;}
  .doc-row2-actions .doc-btn:nth-child(2){display:none;}
}

/* ===== Documentacion solicitada v2 : hero / stats / rows ===== */
.dsol-hero{display:flex; align-items:center; justify-content:space-between; gap:24px; padding:26px 30px; border-radius:var(--radius); background:linear-gradient(115deg, #2a1a0f 0%, #3d2a16 55%, #52381e 100%); color:#f7f3ec; margin-bottom:22px; position:relative; overflow:hidden;}
.dsol-hero::after{content:""; position:absolute; right:-70px; top:-70px; width:240px; height:240px; border-radius:50%; background:radial-gradient(circle, rgba(255,255,255,0.10), transparent 70%);}
.dsol-hero-left{min-width:0;}
.dsol-hero-k{display:inline-flex; align-items:center; gap:6px; font-size:11px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:#e3c9a4; margin-bottom:8px;}
.dsol-hero-left h3{font-family:var(--serif); font-size:24px; font-weight:700; margin-bottom:6px; color:#ffffff;}
.dsol-hero-left p{font-size:13px; color:#e8dbca; margin:0;}
.dsol-hero-right{display:flex; gap:14px; flex-shrink:0;}
.dsol-hero-stat{min-width:92px; padding:12px 16px; border-radius:var(--radius-sm); background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.14); display:flex; flex-direction:column; align-items:center; gap:2px;}
.dsol-hero-stat strong{font-size:20px; font-weight:800; color:#ffffff; line-height:1;}
.dsol-hero-stat span{font-size:11px; color:#e8dbca; white-space:nowrap;}
.dsol-stats{display:grid; grid-template-columns:repeat(4, 1fr); gap:14px; margin-bottom:22px;}
.dsol-stat{display:flex; align-items:center; gap:12px; padding:16px 18px; background:var(--white); border:1px solid var(--line); border-radius:var(--radius-sm); transition:box-shadow 0.15s ease;}
.dsol-stat:hover{box-shadow:var(--shadow-xs);}
.dsol-stat-ic{width:40px; height:40px; border-radius:var(--radius-sm); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.dsol-stat-ic svg{width:19px; height:19px;}
.dsol-stat-ic.blue{background:#eaf1fb; color:#2563eb;}
.dsol-stat-ic.purple{background:#f3eefc; color:#7c3aed;}
.dsol-stat-ic.amber{background:#fdf3e0; color:#d97706;}
.dsol-stat-ic.teal{background:#e6f6f4; color:#0d9488;}
.dsol-stat > div{display:flex; flex-direction:column;}
.dsol-stat span{font-size:11px; color:var(--ink-soft); font-weight:600;}
.dsol-stat strong{font-size:18px; font-weight:800; color:var(--ink); line-height:1.1;}
.dsol-section-h{font-family:var(--serif); font-weight:700; font-size:15px; color:var(--ink); margin-bottom:12px;}
.dsol-row{display:flex; align-items:center; gap:14px; padding:15px 16px; background:var(--white); border:1px solid var(--line); border-radius:var(--radius-sm); margin-bottom:10px; transition:box-shadow 0.15s ease, border-color 0.15s ease;}
.dsol-row:hover{box-shadow:var(--shadow-xs); border-color:#e5ddd0;}
.dsol-row-ic{width:38px; height:38px; border-radius:var(--radius-sm); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.dsol-row-ic svg{width:17px; height:17px;}
.dsol-row-ic.pend{background:#fdf3e0; color:#b45309;}
.dsol-row-ic.ok{background:#e5f4ea; color:#15803d;}
.dsol-row-body{min-width:0; flex:1;}
.dsol-row-body strong{display:block; font-size:13px; font-weight:700; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.dsol-row-body span{display:block; font-size:11px; color:var(--ink-soft); margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.dsol-pill{flex-shrink:0; font-size:10px; font-weight:700; letter-spacing:0.05em; text-transform:uppercase; border-radius:999px; padding:5px 12px;}
.dsol-pill.ok{background:#e5f4ea; color:#15803d;}
.dsol-pill.pend{background:#fdf3e0; color:#b45309;}
.dsol-btn-solid{flex-shrink:0; padding:9px 16px; border-radius:var(--radius-sm); border:none; background:#16402c; color:#ffffff; font-size:12px; font-weight:700; cursor:pointer; transition:background 0.15s ease;}
.dsol-btn-solid:hover{background:#1d5a3e;}
.dsol-row-done{flex-shrink:0; width:30px; height:30px; border-radius:999px; background:#e5f4ea; color:#15803d; display:flex; align-items:center; justify-content:center;}
.dsol-row-done svg{width:14px; height:14px;}
.dsol-empty{display:flex; flex-direction:column; align-items:center; gap:10px; padding:56px 20px; background:var(--white); border:1px dashed var(--line); border-radius:var(--radius-sm); text-align:center;}
.dsol-empty-ic{width:46px; height:46px; border-radius:var(--radius-sm); background:#fdf3e0; color:#b45309; display:flex; align-items:center; justify-content:center;}
.dsol-empty-ic svg{width:22px; height:22px;}
.dsol-empty h3{font-family:var(--serif); font-size:16px; font-weight:700; margin:0;}
.dsol-empty p{font-size:12px; color:var(--ink-soft); margin:0;}
@media (max-width:860px){
  .dsol-hero{flex-direction:column; align-items:flex-start;}
  .dsol-stats{grid-template-columns:repeat(2, 1fr);}
  .dsol-row .dsol-pill{display:none;}
}
@media (max-width:560px){
  .dsol-stats{grid-template-columns:1fr;}
}










/* ===== Dashboard v10 : emeralde & gold luxe ===== */
.dash-hero-left h1{font-family:var(--sans) !important; margin:0 !important; line-height:1.18 !important; letter-spacing:-0.015em !important; display:flex !important; align-items:center !important; gap:24px !important; font-size:unset !important; color:unset !important;}
.dash-hero-left h1 .greet-avatar{width:72px !important; height:72px !important; border-radius:50% !important; flex-shrink:0 !important; display:flex !important; align-items:center !important; justify-content:center !important; font-family:var(--serif) !important; font-size:29px !important; font-weight:700 !important; color:#072b1d !important; background:linear-gradient(135deg, #f0d47a, #d4af37) !important; border:2px solid rgba(240,212,122,0.75) !important; box-shadow:0 0 0 5px rgba(212,175,55,0.16), 0 12px 30px -8px rgba(212,175,55,0.50) !important; margin:0 !important;}
.dash-hero-left h1 .greet-block{display:flex !important; flex-direction:column !important; gap:6px !important; min-width:0 !important;}
.dash-hero-left h1 .greet-name{display:block !important; font-family:var(--serif) !important; font-size:35px !important; font-weight:700 !important; color:#ffffff !important; white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; margin:0 !important; letter-spacing:-0.015em !important;}
.dash-hero-left h1 .greet-line{display:block !important; font-size:13px !important; font-weight:600 !important; color:#cde8d6 !important; letter-spacing:0.05em !important; margin:0 !important;}
.dash-hero-left h1 .greet-line b{color:#e9d47a !important; font-weight:800 !important;}

.dash-hero{display:flex; align-items:center; justify-content:space-between; gap:30px; padding:44px 48px; margin-bottom:32px; border-radius:26px; overflow:hidden; background:radial-gradient(circle at 85% 15%, #14523a 0%, #0a3826 42%, #072b1d 100%); color:#eef7f1; position:relative; border:1px solid rgba(212,175,55,0.30); box-shadow:0 24px 60px -20px rgba(7,43,29,0.60);}
.dash-hero::before{content:""; position:absolute; inset:0; background:radial-gradient(circle at 8% 95%, rgba(212,175,55,0.14), transparent 40%), radial-gradient(circle at 50% 50%, rgba(20,120,80,0.20), transparent 60%); pointer-events:none;}
.dash-hero::after{content:""; position:absolute; left:0; right:0; bottom:0; height:3px; background:linear-gradient(90deg, transparent, #d4af37 30%, #f0d47a 50%, #d4af37 70%, transparent); pointer-events:none;}
.dash-hero-left{flex:1; min-width:0; position:relative; z-index:1;}
.dash-hero-k{display:inline-flex; align-items:center; gap:10px; font-size:10.5px; font-weight:800; letter-spacing:0.26em; text-transform:uppercase; color:#e9d47a; margin-bottom:20px;}
.dash-hero-k::before{content:""; width:30px; height:1.5px; background:linear-gradient(90deg, #d4af37, transparent); display:inline-block;}
.dash-hero-k::after{content:""; width:30px; height:1.5px; background:linear-gradient(90deg, transparent, #d4af37); display:inline-block;}
.dash-hero-left p{font-size:13.5px; color:#b5d4c1; margin:24px 0 26px; line-height:1.6;}
.dash-hero-left .hero-chips{display:flex; gap:10px; flex-wrap:wrap;}
.dash-hero-left .hero-chip{display:inline-flex; align-items:center; gap:9px; font-size:12px; font-weight:600; color:#e2f2e7; background:rgba(212,175,55,0.10); border:1px solid rgba(212,175,55,0.30); border-radius:999px; padding:10px 18px; backdrop-filter:blur(8px); transition:background 0.16s ease, border-color 0.16s ease;}
.dash-hero-left .hero-chip:hover{background:rgba(212,175,55,0.20); border-color:rgba(212,175,55,0.55);}
.dash-hero-left .hero-chip b{color:#f0d47a; font-weight:800;}
.dash-hero-right{flex-shrink:0; display:flex; gap:17px; position:relative; z-index:1;}
.dash-hero-stat{min-width:132px; padding:23px 25px; border-radius:20px; background:rgba(255,255,255,0.05); border:1px solid rgba(212,175,55,0.26); display:flex; flex-direction:column; align-items:center; gap:8px; backdrop-filter:blur(12px); position:relative; overflow:hidden; transition:transform 0.18s ease, border-color 0.18s ease, background 0.18s ease;}
.dash-hero-stat:hover{transform:translateY(-5px); border-color:rgba(212,175,55,0.65); background:rgba(212,175,55,0.12);}
.dash-hero-stat::before{content:""; position:absolute; left:24px; right:24px; top:0; height:2px; border-radius:3px; background:linear-gradient(90deg, transparent, #d4af37, transparent);}
.dash-hero-stat strong{font-family:var(--serif); font-size:36px; font-weight:700; color:#ffffff; line-height:1;}
.dash-hero-stat span{font-size:10px; font-weight:800; letter-spacing:0.16em; text-transform:uppercase; color:#cde8d6; text-align:center;}
.grid-4{gap:18px;}
.grid-4 .kpi-card{background:linear-gradient(150deg, #ffffff 0%, #fbfdf9 100%); border:1px solid rgba(10,60,40,0.10); border-radius:22px; padding:25px; transition:box-shadow 0.2s ease, transform 0.2s ease, border-color 0.2s ease; position:relative; overflow:hidden;}
.grid-4 .kpi-card::after{content:""; position:absolute; left:0; right:0; bottom:0; height:3.5px; background:linear-gradient(90deg, #0a5c3c, #d4af37); transform:scaleX(0); transform-origin:left; transition:transform 0.26s ease;}
.grid-4 .kpi-card:hover{box-shadow:0 24px 52px -16px rgba(10,60,40,0.30); transform:translateY(-4px); border-color:rgba(212,175,55,0.45);}
.grid-4 .kpi-card:hover::after{transform:scaleX(1);}
.grid-4 .kpi-card .ic{width:50px; height:50px; border-radius:16px; display:flex; align-items:center; justify-content:center; flex-shrink:0; background:linear-gradient(135deg, #0a5c3c, #0d6b35); color:#f0d47a; box-shadow:0 10px 24px -8px rgba(10,92,60,0.50), inset 0 2px 0 rgba(255,255,255,0.15);}
.grid-4 .kpi-card .ic svg{width:22px; height:22px;}
.grid-4 .kpi-card .lbl{font-size:10.5px; color:var(--ink-faint); font-weight:800; letter-spacing:0.16em; text-transform:uppercase; margin-top:18px;}
.grid-4 .kpi-card strong{font-family:var(--serif); font-size:31px; font-weight:700; color:#0a3826; line-height:1.15;}
.grid-2{gap:18px;}
.dcard{background:var(--white); border:1px solid rgba(10,60,40,0.10); border-radius:22px; padding:27px; transition:box-shadow 0.2s ease, transform 0.2s ease;}
.dcard:hover{box-shadow:0 22px 50px -16px rgba(10,60,40,0.26); transform:translateY(-3px);}
.dcard > h3{font-family:var(--serif); font-weight:700; font-size:17px; color:#0a3826; margin-bottom:19px; padding-bottom:15px; border-bottom:1px solid rgba(10,60,40,0.10); display:flex; align-items:center; gap:13px; position:relative;}
.dcard > h3::before{content:""; width:16px; height:16px; border-radius:7px; background:linear-gradient(135deg, #0a5c3c, #d4af37); flex-shrink:0; box-shadow:0 4px 10px rgba(10,92,60,0.32);}
.dcard > h3::after{content:""; position:absolute; left:0; bottom:-1px; width:42px; height:2px; background:linear-gradient(90deg, #d4af37, transparent);}
.task-row{display:flex; align-items:center; gap:14px; padding:12px 13px; border-radius:17px; transition:background 0.15s ease; text-decoration:none; border:1px solid transparent; margin-bottom:3px;}
.task-row:hover{background:linear-gradient(90deg, rgba(212,175,55,0.10), rgba(10,92,60,0.05) 70%, transparent); border-color:rgba(212,175,55,0.30);}
.task-row .ic{width:39px; height:39px; border-radius:14px; display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.task-row .ic svg{width:16px; height:16px;}
.task-row .t-name{font-size:13px; font-weight:800; color:#0a3826; line-height:1.3;}
.task-row .t-meta{font-size:11.5px; color:var(--ink-soft); margin-top:2px;}
.task-row .chev{margin-left:auto; color:#d4af37; display:flex; opacity:0; transform:translateX(-7px); transition:all 0.2s ease;}
.task-row:hover .chev{opacity:1; transform:translateX(0);}
.due-row{display:flex; align-items:center; gap:15px; padding:13px 15px; border:1px solid rgba(10,60,40,0.11); border-radius:19px; margin-bottom:10px; background:var(--white); transition:box-shadow 0.15s ease, transform 0.15s ease, border-color 0.15s ease;}
.due-row:hover{box-shadow:0 16px 38px -12px rgba(10,60,40,0.28); transform:translateY(-2px); border-color:rgba(212,175,55,0.42);}
.due-row .d-date{flex-shrink:0; min-width:88px; font-family:var(--serif); font-size:12px; font-weight:700; color:#072b1d; background:linear-gradient(135deg, #fdf6dd, #f5e7b0); border-radius:15px; padding:10px 14px; text-align:center; border:1px solid rgba(212,175,55,0.45); box-shadow:0 5px 14px -5px rgba(212,175,55,0.55);}
.due-row .d-body{min-width:0; flex:1;}
.due-row .d-type{font-size:12.5px; font-weight:800; color:#0a3826; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.due-row .d-docs{font-size:11.5px; color:var(--ink-soft); margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.due-row .status-pill{flex-shrink:0; font-size:10px; padding:4px 12px; border-radius:999px;}
.modules-status{position:relative;}
.modules-status > div > div{padding:9px 11px; border-radius:15px; transition:background 0.14s ease;}
.modules-status > div > div:hover{background:linear-gradient(90deg, rgba(212,175,55,0.08), transparent);}
@media (max-width:1020px){
  .dash-hero{flex-direction:column; align-items:stretch;}
  .dash-hero-right{width:100%; display:grid; grid-template-columns:repeat(3, 1fr);}
  .grid-4{grid-template-columns:repeat(2, 1fr) !important;}
}
@media (max-width:620px){
  .dash-hero-right{grid-template-columns:1fr;}
  .dash-hero{padding:30px 24px;}
  .dash-hero-left h1{flex-direction:column !important; align-items:flex-start !important; gap:18px !important;}
  .dash-hero-left h1 .greet-name{font-size:27px !important; white-space:normal !important;}
  .grid-4{grid-template-columns:1fr !important;}
}

/* ===== Portal logo : grand comme le CRM ===== */
.logo img{height:64px !important; width:auto !important;}
.logo{gap:12px !important;}
.dash-sidebar .logo{margin:4px 0 10px !important; display:flex !important; justify-content:center !important;}

.dash-sidebar .logo img, .dash-topbar .logo img{height:64px !important; width:auto !important;}

.dash-topbar{height:112px !important;}
.dash-main{padding-top:112px !important;}
.dash-topbar .logo{display:flex !important; align-items:center !important;}
.dash-topbar .logo img{height:98px !important; max-width:300px !important; object-fit:contain !important;}
@media (max-width:860px){
  .dash-topbar{height:72px !important;}
  .dash-main{padding-top:72px !important;}
  .dash-topbar .logo img{height:74px !important;}
}

/* ===== Search popup : style or ===== */
.search-pop{border-radius:16px !important; border:1px solid rgba(10,60,40,0.12) !important; box-shadow:0 18px 42px -12px rgba(10,60,40,0.28) !important; overflow:hidden !important; z-index:60 !important;}
.search-pop a{transition:background 0.14s ease !important; border-bottom:1px solid rgba(10,60,40,0.06) !important;}
.search-pop a:hover{background:linear-gradient(90deg, rgba(212,175,55,0.12), rgba(10,92,60,0.06) 75%, transparent) !important;}
.search-pop a:hover .s-type{background:#d4af37 !important; color:#ffffff !important;}
.search-pop .s-type{border-radius:999px !important;}
.top-search input{border-radius:999px !important; border:1.5px solid rgba(10,60,40,0.14) !important; transition:border-color 0.16s ease, box-shadow 0.16s ease !important;}
.top-search input:focus{border-color:#0d6b35 !important; box-shadow:0 0 0 3.5px rgba(13,107,53,0.14) !important;}

/* ===== Client name : bien present devant Hola ===== */
.dash-hero-left h1 .greet-name{font-size:40px !important; font-weight:800 !important; color:#ffffff !important; letter-spacing:-0.02em !important; text-shadow:0 2px 14px rgba(0,0,0,0.30) !important;}
.dash-hero-left h1 .greet-name::after{content:""; display:block; width:74px; height:3px; border-radius:3px; margin-top:10px; background:linear-gradient(90deg, #f0d47a, #d4af37); box-shadow:0 2px 8px rgba(212,175,55,0.45);}
.dash-hero-left h1 .greet-line{font-size:14px !important; font-weight:600 !important; color:#cde8d6 !important; margin-top:6px !important;}
.dash-hero-left h1 .greet-line b{color:#f0d47a !important; font-weight:800 !important;}
.dash-hero-left h1 .greet-avatar{width:84px !important; height:84px !important; font-size:34px !important;}
@media (max-width:620px){
  .dash-hero-left h1 .greet-name{font-size:30px !important;}
  .dash-hero-left h1 .greet-avatar{width:64px !important; height:64px !important; font-size:26px !important;}
}

/* ===== Mobile session : layout unifie comme Inicio (toutes les pages) ===== */
@media (max-width:900px){
  .dash-topbar{height:76px !important; padding:10px 14px !important;}
  .dash-topbar .logo img{height:54px !important; max-width:190px !important;}
  .dash-main{padding:18px 14px 60px !important;}
  .dash-sidebar{width:260px !important; padding:14px 12px !important; border-radius:0 20px 20px 0 !important;}
  .dash-sidebar a{padding:13px 15px !important; border-radius:12px !important; font-size:14.2px !important;}
  .dash-sidebar h5{margin:14px 10px 6px !important; font-size:10.5px !important;}
  .dash-head h1{font-size:23px !important;}
  .dash-head p{font-size:13.5px !important;}
  .dcard{border-radius:18px !important; padding:19px 17px !important;}
  .dcard > h3{font-size:16px !important;}
  .kpi-card{border-radius:18px !important; padding:19px 17px !important;}
  .kpi-card strong{font-size:24px !important;}
  .greet-hero, .dash-hero{padding:24px 20px !important; border-radius:20px !important;}
  .greet-hero h1, .dash-hero-left h1 .greet-name{font-size:27px !important;}
  .hero-chip{padding:7px 12px !important; font-size:11.5px !important;}
  .grid-4{gap:12px !important;}
  .grid-2{gap:13px !important;}
  .cita-hero, .dsol-hero, .doc-hero{padding:22px 20px !important; border-radius:20px !important;}
  .cita-hero h3, .dsol-hero-left h3, .doc-hero-left h3{font-size:21px !important;}
  .task-row{padding:11px 11px !important;}
  .task-row .t-name{font-size:12.8px !important;}
  .due-row{padding:11px 12px !important;}
  .due-row .d-date{min-width:76px !important; font-size:11.5px !important;}
  .doc-row, .dsol-row, .doc-row2{padding:12px 12px !important;}
  .inbox-item{padding:12px !important;}
}
@media (max-width:560px){
  .dash-topbar{height:66px !important; padding:8px 12px !important;}
  .dash-topbar .logo img{height:46px !important; max-width:160px !important;}
  .dash-main{padding:14px 11px 55px !important;}
  .dash-topbar .btn{display:none !important;}
  .dash-head h1{font-size:20px !important;}
  .dash-head{gap:12px !important; margin-bottom:18px !important;}
  .dcard{padding:16px 14px !important;}
  .grid-4{grid-template-columns:repeat(2, 1fr) !important; gap:10px !important;}
  .kpi-card{padding:15px 13px !important;}
  .kpi-card .ic{width:38px !important; height:38px !important;}
  .kpi-card .ic svg{width:17px !important; height:17px !important;}
  .kpi-card strong{font-size:20px !important;}
  .kpi-card .lbl{font-size:9.5px !important;}
  .greet-hero, .dash-hero{padding:20px 16px !important;}
  .greet-hero h1{font-size:23px !important;}
  .dash-hero-left h1{flex-direction:column !important; align-items:flex-start !important; gap:14px !important;}
  .dash-hero-left h1 .greet-avatar{width:60px !important; height:60px !important; font-size:24px !important;}
  .dash-hero-left h1 .greet-name{font-size:25px !important; white-space:normal !important;}
  .dash-hero-right{width:100% !important; display:grid !important; grid-template-columns:repeat(3, 1fr) !important; gap:10px !important; padding:0 !important;}
  .dash-hero-stat{min-width:0 !important; padding:13px 10px !important;}
  .dash-hero-stat strong{font-size:22px !important;}
  .hero-chips{gap:6px !important;}
  .grid-2{grid-template-columns:1fr !important;}
  .cita-hero-right, .dsol-hero-right{width:100% !important;}
  .dsol-stats, .doc-stats{grid-template-columns:repeat(2, 1fr) !important; gap:10px !important;}
  .doc-filters{gap:6px !important;}
  .doc-filter{padding:7px 11px !important; font-size:11px !important;}
  .topbar-actions .icon-btn{width:38px !important; height:38px !important;}
}

/* ===== Mobile : expedientes + citas (mise en page unifiee) ===== */
@media (max-width:900px){
  /* Expedientes */
  .exp-hero{padding:22px 20px !important; border-radius:20px !important; flex-direction:column !important; align-items:flex-start !important; gap:18px !important;}
  .exp-hero-left h3{font-size:21px !important;}
  .exp-hero-k{font-size:10.5px !important;}
  .exp-hero-right{width:100% !important; display:grid !important; grid-template-columns:repeat(3, 1fr) !important; gap:10px !important;}
  .exp-hero-stat{min-width:0 !important; padding:13px 10px !important;}
  .exp-hero-stat strong{font-size:21px !important;}
  .exp-hero-stat span{font-size:9.5px !important;}
  .exp-toolbar{flex-direction:column !important; align-items:stretch !important; gap:11px !important;}
  .exp-search-wrap{max-width:none !important;}
  .exp-filters{gap:7px !important; flex-wrap:wrap !important;}
  .exp-filter{padding:8px 13px !important; font-size:11.5px !important;}
  .exp-row{padding:13px 13px !important; gap:12px !important;}
  .exp-row-ic{width:42px !important; height:42px !important;}
  .exp-row-ic svg{width:19px !important; height:19px !important;}
  .exp-row-id{font-size:10px !important;}
  .exp-row-body strong{font-size:13.2px !important; white-space:normal !important;}
  .exp-row-meta{white-space:normal !important;}
  .exp-meta-item{font-size:10.5px !important;}
  .exp-progress{max-width:100% !important;}
  .exp-crm-panel{padding:16px 15px !important;}
  .exp-empty{padding:40px 16px !important;}
  /* Citas */
  .cita-hero{padding:22px 20px !important; border-radius:20px !important; gap:18px !important;}
  .cita-hero-k{font-size:10.5px !important;}
  .cita-hero-body h3{font-size:21px !important;}
  .cita-hero-date{font-size:12px !important;}
  .cita-stats{grid-template-columns:repeat(3, 1fr) !important; gap:10px !important;}
  .cita-stat{padding:13px 11px !important;}
  .cita-stat strong{font-size:20px !important;}
  .cita-stat span{font-size:9.5px !important;}
  .cita-cal-card{padding:15px 13px !important; border-radius:18px !important;}
  .cita-cal-nav{font-size:13px !important;}
  .cita-cal-month-badge{font-size:12.5px !important;}
  .cita-cal-grid{gap:4px !important;}
  .cita-day-row{padding:11px 11px !important; gap:11px !important;}
  .cita-day-ic{width:38px !important; height:38px !important;}
  .cita-day-ic svg{width:16px !important; height:16px !important;}
  .cita-row{padding:12px 11px !important; gap:11px !important;}
  .cita-row-ic{width:40px !important; height:40px !important;}
  .cita-row-body strong{font-size:13.2px !important; white-space:normal !important;}
  .cita-row-date{font-size:11px !important;}
  .cita-history-card{padding:15px 14px !important;}
  .cita-empty{padding:38px 14px !important;}
}
@media (max-width:560px){
  /* Expedientes */
  .exp-hero{padding:20px 16px !important;}
  .exp-hero-right{grid-template-columns:repeat(3, 1fr) !important; gap:8px !important;}
  .exp-hero-right{padding:0 !important;}
  .exp-row .exp-progress{display:none !important;}
  .exp-row-arrow{display:none !important;}
  .exp-filters{gap:6px !important;}
  .exp-filter{padding:7px 10px !important; font-size:10.8px !important;}
  .exp-row-meta .exp-meta-sep{display:none !important;}
  .exp-meta-item{display:inline-block !important; margin-right:6px !important;}
  /* Citas */
  .cita-hero{padding:20px 16px !important;}
  .cita-stats{grid-template-columns:repeat(3, 1fr) !important; gap:8px !important;}
  .cita-stat{padding:11px 8px !important;}
  .cita-stat strong{font-size:17px !important;}
  .cita-stat .cita-stat-ic{display:none !important;}
  .cita-cal-month-card{padding:10px !important;}
  .cita-cal-nav{flex-direction:column !important; gap:8px !important; align-items:stretch !important;}
  .cita-cal-nav .cita-cal-btn{justify-content:center !important;}
  .cita-day-row .cita-row-arrow{display:none !important;}
  .cita-row-ic{width:34px !important; height:34px !important;}
  .cita-row-ic svg{width:14px !important; height:14px !important;}
  .cita-hero-side{flex-direction:column !important; align-items:stretch !important; width:100% !important; gap:10px !important;}
  .cita-hero-side .btn{width:100% !important; justify-content:center !important;}
}

/* ===== Mensajes : composer fixe (ne scrolle pas avec la page) ===== */
/* Desktop : l'app messagerie prend la hauteur du viewport moins la topbar ; la colonne chat pilote son propre scroll */
@media (min-width:901px){
  .msg-app{height:calc(100vh - 150px) !important; min-height:560px !important;}
  .msg-side{height:100% !important; overflow-y:auto !important;}
  .msg-panel{height:100% !important; overflow:hidden !important;}
  .chat-messages{flex:1 1 auto !important; overflow-y:auto !important; min-height:0 !important;}
  .composer{flex-shrink:0 !important;}
}
/* Mobile : hauteur = viewport moins topbar ; liste pliable compacte ; chat scroll interne ; composer toujours visible */
@media (max-width:900px){
  .msg-app{height:calc(100dvh - 100px) !important; min-height:0 !important;}
  .msg-side{max-height:180px !important; overflow-y:auto !important; border-bottom:1.5px solid var(--line) !important;}
  .msg-panel{height:auto !important; flex:1 !important; min-height:0 !important; overflow:hidden !important;}
  .chat-messages{flex:1 1 auto !important; overflow-y:auto !important; min-height:0 !important; -webkit-overflow-scrolling:touch;}
  .composer{flex-shrink:0 !important; position:sticky !important; bottom:0 !important; background:#fff !important; z-index:5 !important;}
}

/* ===== Vider conversation : bouton or ===== */
.msg-vider{border-color:rgba(212,175,55,0.55) !important; color:#b4882c !important;}
.msg-vider:hover{background:#d4af37 !important; color:#ffffff !important; border-color:#d4af37 !important;}
.msg-vider svg{stroke:currentColor;}

.msg-head-actions{margin-left:auto; display:flex; gap:9px; flex-shrink:0;}
.msg-chat-head{display:flex; align-items:center; gap:13px;}
.msg-chat-head .msg-head-txt{min-width:0; flex:1;}
@media (max-width:560px){
  .msg-head-actions{gap:7px;}
  .msg-head-actions .msg-supr{width:38px !important; height:38px !important;}
}

/* ===== Staff line : nom — role sous le titre des messages ===== */
.inbox-staff{font-size:11px !important; font-weight:700 !important; color:#0d6b35 !important; margin:2px 0 3px !important; display:flex !important; align-items:center !important; gap:5px !important;}
.inbox-staff::before{content:""; width:6px; height:6px; border-radius:50%; background:linear-gradient(135deg, #0d6b35, #34d399); flex-shrink:0;}
.msg-head-staff{font-size:12px !important; font-weight:700 !important; color:#f0d47a !important; margin-top:3px !important; display:flex !important; align-items:center !important; gap:6px !important;}
.msg-head-staff::before{content:""; width:7px; height:7px; border-radius:50%; background:linear-gradient(135deg, #f0d47a, #d4af37); box-shadow:0 0 6px rgba(212,175,55,0.55); flex-shrink:0;}
.msg-head-staff + p{margin-top:2px !important; opacity:0.8;}

/* --- Fichier joint dans la conversation (mensajes) --- */
.chat-file{display:flex;align-items:center;gap:9px;background:#fff;border:1.5px solid #c7dbff;border-radius:12px;padding:9px 13px;max-width:75%;font-size:12.8px;color:#0f2a5c;box-shadow:0 3px 10px rgba(15,23,42,.07);margin:2px 0;text-decoration:none;}
.chat-row.me .chat-file{align-self:flex-end;border-color:#bfdbfe;background:#eff6ff;}
.chat-row.them .chat-file{align-self:flex-start;}
.chat-file svg{flex-shrink:0;color:#2563eb;}
.chat-file .cf-name{font-weight:700;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.chat-file .cf-size{font-size:10.5px;color:#64748b;}
.chat-file .cf-dl{margin-left:6px;font-weight:700;color:#2563eb;font-size:11.5px;}
.chat-file:hover{border-color:#93c5fd;background:#dbeafe;}
/* --- Telegram-style chat structure (mensajes) --- */
.chat-row{align-items:flex-start;}
.chat-row .chat-col{display:flex; flex-direction:column; gap:4px; min-width:0;}
.chat-row.me .chat-col{align-items:flex-end;}
.chat-row.them .chat-col{align-items:flex-start;}
.msg-avatar{
  width:34px; height:34px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:11px; font-weight:800; flex-shrink:0;
  color:#fff; margin-top:2px;
  box-shadow:0 3px 8px rgba(15,23,42,.18);
  user-select:none;
}
.msg-avatar.me{background:linear-gradient(135deg,#0ea5e9,#6366f1);}
.msg-avatar.them{background:linear-gradient(135deg,#1d4ed8,#3b82f6);}
.msg-avatar-spacer{width:34px; flex-shrink:0;}
.msg-sender{display:block; font-size:11.5px; font-weight:800; color:#1d4ed8; margin-bottom:3px; letter-spacing:.02em;}
.chat-bubble.me .msg-sender{color:rgba(255,255,255,.85);}
.chat-row .chat-del{opacity:0; margin-top:6px;}
.chat-row:hover .chat-del{opacity:1;}
/* --- Message presentation polish (Telegram-grade) --- */
.chat-messages{
  background:
    radial-gradient(circle at 15% 15%, rgba(37,99,235,0.05) 0%, transparent 45%),
    radial-gradient(circle at 85% 85%, rgba(124,58,237,0.04) 0%, transparent 45%),
    linear-gradient(180deg,#f6f8fd 0%, #fbfcfe 100%);
}
.chat-bubble{
  padding:12px 18px 9px;
  border-radius:18px;
  font-size:13.8px;
  line-height:1.55;
  position:relative;
  box-shadow:0 2px 12px rgba(15,23,42,.06);
}
.chat-bubble.them{
  background:#ffffff;
  border:1.5px solid #e3ecff;
  border-bottom-left-radius:6px;
  color:#0f2a5c;
  box-shadow:0 3px 14px rgba(37,99,235,.08);
}
.chat-bubble.me{
  background:linear-gradient(135deg,#1d4ed8 0%,#3b82f6 55%,#6366f1 100%);
  border-bottom-right-radius:6px;
  box-shadow:0 6px 20px rgba(29,78,216,.35);
}
/* Petit tail dessiné en pseudo-élément (comme Telegram) */
.chat-bubble.them::before{
  content:"";
  position:absolute;
  left:-6px; bottom:0;
  width:12px; height:12px;
  background:inherit;
  border-left:1.5px solid #e3ecff;
  border-bottom:1.5px solid #e3ecff;
  border-bottom-left-radius:10px;
  clip-path:polygon(0 0, 100% 100%, 0 100%);
}
.chat-bubble.me::before{
  content:"";
  position:absolute;
  right:-6px; bottom:0;
  width:12px; height:12px;
  background:#3b82f6;
  border-bottom-right-radius:10px;
  clip-path:polygon(100% 0, 100% 100%, 0 100%);
}
.chat-bubble .time{
  display:inline-flex; align-items:center; gap:3px;
  float:right;
  font-size:9.5px; opacity:.75; margin:8px -6px -2px 12px;
}
.chat-file{
  border-radius:14px;
  padding:10px 14px;
  background:#ffffff;
  border:1.5px solid #dbe7ff;
  box-shadow:0 3px 12px rgba(37,99,235,.10);
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.chat-file:hover{
  transform:translateY(-2px);
  border-color:#93c5fd;
  box-shadow:0 8px 22px rgba(37,99,235,.18);
}
.chat-file .cf-dl{
  background:#eff6ff;
  color:#1d4ed8;
  border-radius:8px;
  padding:4px 10px;
  font-size:11px;
  font-weight:800;
}
.msg-avatar{cursor:default;}
/* Largeur de lecture optimale + respiration */
.chat-row .chat-col{max-width:min(78%, 560px);}
.chat-messages{scroll-behavior:smooth;}
/* --- Date chip (Telegram style) au-dessus des messages --- */
.chat-date-chip{
  align-self:center;
  background:rgba(15,23,42,.07);
  color:#5c6480;
  font-size:11.5px;
  font-weight:700;
  padding:5px 14px;
  border-radius:20px;
  margin-bottom:6px;
  letter-spacing:.02em;
}
/* --- Fichier en attente d'envoi (composer) --- */
.chat-pending-file{
  width:100%;
  display:flex; align-items:center; gap:8px;
  background:#eff6ff; border:1.5px solid #bfdbfe;
  border-radius:10px; padding:8px 12px;
  font-size:12.5px; font-weight:600; color:#1d4ed8;
  margin-bottom:8px;
}
.chat-pending-file svg{color:#2563eb; flex-shrink:0;}
.chat-pending-file .cpf-name{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.chat-pending-file button{
  margin-left:auto; border:none; background:transparent;
  color:#64748b; cursor:pointer; font-size:14px; line-height:1;
}
.chat-pending-file button:hover{color:#dc2626;}