:root{
  --bg:#f3f6fb;
  --bg-accent:#eef4ff;
  --surface:#ffffff;
  --surface-2:#f8fbff;
  --text:#152033;
  --muted:#6b7280;
  --border:#d9e2f0;
  --line:#e8eef7;
  --primary:#1d4ed8;
  --primary-2:#0f172a;
  --success:#15803d;
  --warning:#b45309;
  --danger:#b91c1c;
  --shadow:0 12px 35px rgba(15,23,42,.08);
  --radius:18px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at top left, rgba(29,78,216,.10), transparent 28%),
    linear-gradient(180deg, #f8fbff 0%, var(--bg) 100%);
}
a{color:var(--primary);text-decoration:none}
a:hover{text-decoration:underline}
.app-shell{max-width:1400px;margin:0 auto;padding:32px 24px 40px}
.page-header,.topbar{
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  margin-bottom:22px;
}
.brand-block{display:flex;flex-direction:column;gap:6px}
.eyebrow{font-size:12px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--primary)}
h1,h2,h3{margin:0 0 10px 0;color:#0f172a;line-height:1.15}
h1{font-size:clamp(1.8rem,2.8vw,2.5rem)}
h2{font-size:1.35rem}
h3{font-size:1.05rem}
p{line-height:1.55}
.lead,.muted{color:var(--muted)}
.badge,.pill,.status-pill{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border-radius:999px;font-size:12px;font-weight:700;border:1px solid transparent;white-space:nowrap}
.badge-soft{background:#e8f0ff;color:var(--primary);border-color:#c8d8ff}
.status-PENDENT,.estat-PENDENT{background:#fff4db;color:var(--warning);border-color:#f4d18a}
.status-EN_PROCES,.estat-EN_PROCES{background:#e4f0ff;color:#165dc6;border-color:#bfd6ff}
.status-COMPLETADA,.estat-COMPLETADA{background:#e8f8ec;color:var(--success);border-color:#bde0c5}
.status-INCIDENCIA,.estat-INCIDENCIA{background:#fdeaea;color:var(--danger);border-color:#f5b8b8}
.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;margin:0 0 22px}
.kpi-card,.bloc,.box,.modal{
  background:rgba(255,255,255,.96);
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}
.kpi-card{padding:18px}
.kpi-label{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:700}
.kpi-value{font-size:1.8rem;font-weight:800;margin-top:6px;color:#0f172a}
.bloc{padding:22px;margin-bottom:20px}
.card-title-row{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.topbar .nav-links,.page-header .nav-links{display:flex;gap:10px;flex-wrap:wrap}
.topbar a,.topbar button,.button,button,[type=submit]{
  appearance:none;border:none;cursor:pointer;border-radius:12px;padding:11px 16px;
  background:linear-gradient(135deg, var(--primary), #2563eb);color:#fff;font-weight:700;
  box-shadow:0 8px 20px rgba(37,99,235,.22);transition:.18s ease;
}
.topbar a.secondary,.button.secondary,.ghost-btn{
  background:#fff;color:var(--primary-2);border:1px solid var(--border);box-shadow:none
}
.topbar a:hover,.topbar button:hover,.button:hover,button:hover,[type=submit]:hover{transform:translateY(-1px);text-decoration:none;filter:saturate(1.02)}
.toolbar-form{display:flex;gap:10px;align-items:center;flex-wrap:wrap;background:var(--surface);padding:12px 14px;border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow)}
label{font-weight:700;color:#334155;font-size:.95rem}
input,select,textarea{
  width:100%;padding:12px 14px;border-radius:12px;border:1px solid #cbd5e1;background:#fff;
  color:var(--text);font:inherit;outline:none;transition:border-color .15s, box-shadow .15s;
}
input:focus,select:focus,textarea:focus{border-color:#93c5fd;box-shadow:0 0 0 4px rgba(59,130,246,.12)}
textarea{min-height:90px;resize:vertical}
.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:16px}
table{width:100%;border-collapse:separate;border-spacing:0;background:#fff}
th,td{padding:14px 14px;font-size:14px;text-align:left;border-bottom:1px solid var(--line);vertical-align:middle}
th{position:sticky;top:0;background:var(--surface-2);color:#334155;font-size:12px;text-transform:uppercase;letter-spacing:.06em}
tr:hover td{background:#f8fbff}
.part-row{transition:transform .14s ease, box-shadow .14s ease}
.part-row:hover{transform:translateY(-1px)}
.row{display:flex;gap:14px;margin-bottom:14px;align-items:flex-start;flex-wrap:wrap}
.row>div{flex:1;min-width:220px}
.link-box{max-height:260px;overflow:auto;border:1px solid var(--line);padding:14px;border-radius:14px;background:linear-gradient(180deg,#fff,#f8fbff)}
.modal-backdrop{display:none;position:fixed;inset:0;background:rgba(15,23,42,.45);backdrop-filter:blur(4px);z-index:999}
.modal{display:none;position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:min(980px,94vw);max-height:min(88vh,820px);overflow:hidden;padding:20px;z-index:1000}
.msg-ok,.ok{color:var(--success);font-weight:700;background:#edf9f0;border:1px solid #c8ead1;padding:14px 16px;border-radius:14px}
.error{color:var(--danger);font-weight:700;background:#fff1f1;border:1px solid #f5c2c2;padding:14px 16px;border-radius:14px}
.detail-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.detail-item{padding:14px;border:1px solid var(--line);border-radius:14px;background:linear-gradient(180deg,#fff,#fbfdff)}
.detail-item strong{display:block;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.box{max-width:460px;width:min(460px,100%);padding:30px;background:rgba(255,255,255,.96)}
.login-note{padding:12px 14px;border-radius:14px;background:#eef4ff;border:1px solid #cfe0ff;color:#274690}
.form-stack>*+*{margin-top:14px}
.form-actions{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-top:18px}
img.preview-thumb{max-width:220px;max-height:140px;border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow)}
@media (max-width:860px){
  .app-shell{padding:20px 14px 28px}
  .bloc{padding:18px}
  th,td{padding:12px 10px}
  .modal{padding:16px}
}


.login-page{
  min-height:100vh;
  background:
    linear-gradient(120deg, rgba(7,15,30,.72), rgba(14,31,63,.58)),
    url("login-background.png") center center / cover no-repeat fixed;
}
.login-page::before{
  content:"";
  position:fixed;
  inset:0;
  background:
    radial-gradient(circle at 15% 20%, rgba(96,165,250,.22), transparent 30%),
    radial-gradient(circle at 85% 80%, rgba(255,255,255,.10), transparent 26%);
  pointer-events:none;
}
.login-shell{
  position:relative;
  isolation:isolate;
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:32px 24px;
}
.login-backdrop{
  position:absolute;
  inset:24px;
  border-radius:28px;
  border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(135deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12);
  backdrop-filter:blur(3px);
  z-index:0;
}
.login-box{
  position:relative;
  z-index:1;
  max-width:520px;
  width:min(520px,100%);
  padding:34px;
  background:linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,255,255,.90));
  border:1px solid rgba(255,255,255,.42);
  box-shadow:0 30px 80px rgba(2,6,23,.28);
  backdrop-filter:blur(10px);
}
.login-kicker{
  display:inline-flex;
  margin-top:8px;
  font-size:12px;
  font-weight:700;
  letter-spacing:.04em;
  color:#dbeafe;
  background:linear-gradient(135deg, rgba(29,78,216,.88), rgba(59,130,246,.78));
  padding:8px 12px;
  border-radius:999px;
  box-shadow:0 10px 24px rgba(37,99,235,.2);
}
.login-box .brand-block{gap:10px;margin-bottom:6px}
.login-box h1{font-size:clamp(2rem,4vw,2.8rem)}
.login-box .lead{font-size:1rem;max-width:42ch;color:#475569}
.login-note{
  margin-top:18px;
  background:linear-gradient(135deg, rgba(238,244,255,.92), rgba(248,250,252,.94));
  border:1px solid rgba(191,219,254,.9);
}
.login-feature-list{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:14px 0 6px;
}
.login-feature-list span{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(203,213,225,.95);
  color:#334155;
  font-size:12px;
  font-weight:700;
}
.login-feature-list span::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:999px;
  background:linear-gradient(135deg, #22c55e, #16a34a);
  box-shadow:0 0 0 4px rgba(34,197,94,.12);
}
.login-box label{display:block;margin-bottom:8px}
.login-box input{
  background:rgba(255,255,255,.92);
  border-color:#d6deeb;
}
.login-box .form-actions{margin-top:22px}
.login-box .muted{font-weight:600;color:#64748b}
@media (max-width:860px){
  .login-backdrop{inset:12px;border-radius:22px}
  .login-box{padding:24px}
}

.login-brand-row{
  display:flex;
  align-items:center;
  gap:16px;
  margin-top:4px;
}
.login-logo{
  width:72px;
  height:72px;
  object-fit:contain;
  flex:0 0 72px;
  border-radius:18px;
  background:rgba(255,255,255,.7);
  padding:6px;
  box-shadow:0 10px 24px rgba(15,23,42,.10);
}
.login-box .brand-block{gap:10px;margin-bottom:16px}
.login-box h1{margin:0;font-size:clamp(1.9rem,4vw,2.7rem);letter-spacing:-0.02em}
@media (max-width:640px){
  .login-brand-row{gap:12px}
  .login-logo{width:58px;height:58px;flex-basis:58px;border-radius:14px}
}


/* Startup login refinement */
.login-page{
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(135deg, rgba(3,7,18,.82) 0%, rgba(10,20,47,.72) 42%, rgba(29,78,216,.30) 100%),
    url("login-background.png") center center / cover no-repeat fixed;
}
.login-page::after{
  content:"";
  position:fixed;
  inset:0;
  background:linear-gradient(90deg, rgba(2,6,23,.42) 0%, rgba(2,6,23,.18) 35%, rgba(2,6,23,.58) 100%);
  pointer-events:none;
}
.login-shell{
  padding:40px 24px;
}
.login-backdrop{
  inset:18px;
  border-radius:34px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(135deg, rgba(255,255,255,.04), rgba(255,255,255,.01));
  backdrop-filter:blur(6px);
}
.login-orb{
  position:absolute;
  border-radius:999px;
  filter:blur(10px);
  opacity:.9;
  pointer-events:none;
  z-index:0;
}
.login-orb-one{
  width:220px;
  height:220px;
  left:8%;
  top:10%;
  background:radial-gradient(circle, rgba(96,165,250,.38) 0%, rgba(96,165,250,0) 68%);
}
.login-orb-two{
  width:280px;
  height:280px;
  right:6%;
  bottom:8%;
  background:radial-gradient(circle, rgba(168,85,247,.28) 0%, rgba(168,85,247,0) 70%);
}
.login-box.login-box-startup{
  max-width:560px;
  padding:38px;
  background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.84));
  border:1px solid rgba(255,255,255,.28);
  box-shadow:0 32px 100px rgba(2,6,23,.34), inset 0 1px 0 rgba(255,255,255,.45);
  backdrop-filter:blur(18px);
}
.login-brand-block{
  margin-bottom:22px;
}
.login-brand-row{
  align-items:center;
  gap:18px;
}
.login-logo-wrap{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  width:92px;
  height:92px;
  border-radius:26px;
  background:linear-gradient(135deg, rgba(255,255,255,.98), rgba(226,232,240,.78));
  box-shadow:0 18px 34px rgba(15,23,42,.16), inset 0 1px 0 rgba(255,255,255,.88);
}
.login-logo-wrap::before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:27px;
  padding:1px;
  background:linear-gradient(135deg, rgba(59,130,246,.55), rgba(168,85,247,.38), rgba(255,255,255,.3));
  -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
}
.login-logo{
  width:72px;
  height:72px;
  padding:0;
  background:transparent;
  box-shadow:none;
  border-radius:0;
}
.login-title-wrap{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.login-box.login-box-startup h1{
  margin:0;
  font-size:clamp(2rem, 4vw, 3rem);
  letter-spacing:-0.045em;
  line-height:1;
}
.login-subtitle{
  margin:0;
  max-width:34ch;
  color:#52607a;
  font-size:1rem;
  line-height:1.5;
}
.login-chip-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:18px;
}
.login-chip-row span{
  display:inline-flex;
  align-items:center;
  padding:8px 12px;
  border-radius:999px;
  font-size:12px;
  font-weight:700;
  color:#0f172a;
  background:rgba(255,255,255,.58);
  border:1px solid rgba(203,213,225,.85);
  backdrop-filter:blur(8px);
}
.login-form{
  position:relative;
}
.login-form::before{
  content:"";
  display:block;
  height:1px;
  margin:0 0 18px 0;
  background:linear-gradient(90deg, rgba(148,163,184,0), rgba(148,163,184,.55), rgba(148,163,184,0));
}
.login-box .error{
  margin-bottom:16px;
  background:rgba(255,241,242,.88);
  border-color:rgba(244,63,94,.22);
}
.login-box input{
  border:1px solid rgba(148,163,184,.30);
  background:rgba(255,255,255,.76);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.72);
}
.login-box input:focus{
  border-color:rgba(59,130,246,.58);
  box-shadow:0 0 0 4px rgba(59,130,246,.12), inset 0 1px 0 rgba(255,255,255,.88);
}
.login-actions{
  margin-top:24px;
}
.login-submit{
  min-width:220px;
  background:linear-gradient(135deg, #2563eb 0%, #4f46e5 48%, #7c3aed 100%);
  box-shadow:0 16px 30px rgba(79,70,229,.32);
}
.login-submit:hover{
  transform:translateY(-2px) scale(1.01);
  filter:brightness(1.03);
}
.login-actions .muted{
  color:#64748b;
  font-weight:700;
}
@media (max-width: 640px){
  .login-shell{padding:18px;}
  .login-backdrop{inset:8px;border-radius:24px;}
  .login-box.login-box-startup{padding:24px;}
  .login-brand-row{align-items:flex-start;}
  .login-logo-wrap{width:78px;height:78px;border-radius:22px;}
  .login-logo{width:60px;height:60px;}
  .login-chip-row{gap:8px;}
  .login-submit{width:100%;min-width:0;}
}


.header-brand-row{display:flex;align-items:center;gap:16px}
.header-logo{width:80px;height:80px;object-fit:contain;border-radius:16px;background:rgba(255,255,255,.78);padding:6px;box-shadow:0 10px 24px rgba(15,23,42,.10)}
.brand-block-header .lead{margin:6px 0 0}
.kpi-grid--five{grid-template-columns:repeat(5,minmax(0,1fr))}
.filter-card{display:flex;flex-direction:column;gap:10px;justify-content:space-between}
.filter-card select{margin-top:auto}
.button-sm{padding:8px 12px;border-radius:10px;font-size:12px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.danger-zone{border-color:#f3c2c2;background:linear-gradient(180deg,#fff,#fff6f6)}
.danger-btn{background:linear-gradient(135deg, #b91c1c, #dc2626)!important;color:#fff!important;box-shadow:0 8px 20px rgba(220,38,38,.2)!important}
@media (max-width:1180px){.kpi-grid--five{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:860px){.kpi-grid--five{grid-template-columns:repeat(2,minmax(0,1fr))}.header-brand-row{align-items:flex-start}.header-logo{width:56px;height:56px}}
@media (max-width:560px){.kpi-grid--five{grid-template-columns:1fr}}


/* Header session dropdown + tracking icon */
.nav-links-header{align-items:center}
.session-dropdown{position:relative}
.session-trigger{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid var(--border);
  background:#fff;
  color:var(--primary-2);
  box-shadow:none;
}
.session-trigger:hover{transform:none;filter:none;background:#f8fbff}
.session-avatar{
  width:32px;height:32px;border-radius:999px;
  display:inline-flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg, var(--primary), #2563eb);
  color:#fff;font-weight:800;font-size:13px;flex:0 0 32px;
}
.session-text{font-weight:700}
.session-caret{width:16px;height:16px;color:#64748b}
.session-menu{
    position:absolute;
    top:calc(100% + 10px);
    right:0;
    min-width:180px;
    padding:8px;
    background:rgba(255,255,255,.98);
    border:1px solid #d9e2f0;
    border-radius:16px;
    box-shadow:0 22px 50px rgba(15,23,42,.14);
    z-index:80;
    display:none;
}

.session-dropdown.is-open .session-menu{
    display:block;
}

.session-menu[hidden]{
  display:none !important;
}

.session-menu a{
  display:block;padding:10px 12px;border-radius:10px;
  color:var(--text);font-weight:700;text-decoration:none;
}
.session-menu a:hover{background:#f8fbff}
.tracking-link{
  width:46px;height:46px;padding:0 !important;
  display:inline-flex;align-items:center;justify-content:center;
}
.tracking-icon{width:22px;height:22px;display:block}


.stats-dropdown{position:relative}
.stats-dropdown summary{list-style:none}
.stats-dropdown summary::-webkit-details-marker{display:none}
.stats-trigger{cursor:pointer}
.stats-dropdown[open] .stats-trigger{background:#eef4ff;border-color:#bcd0ff;box-shadow:0 18px 40px rgba(37,99,235,.12)}
.stats-menu{
  position:absolute;
  top:calc(100% + 10px);
  right:0;
  min-width:260px;
  padding:10px;
  background:rgba(255,255,255,.99);
  border:1px solid #d9e2f0;
  border-radius:18px;
  box-shadow:0 22px 50px rgba(15,23,42,.14);
  z-index:90;
  display:grid;
  gap:8px;
}
.stats-menu-label{
  padding:4px 8px 6px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#64748b;
}
.stats-menu-item{
  display:grid;
  gap:3px;
  padding:10px 12px;
  border-radius:14px;
  text-decoration:none;
  color:var(--text);
  border:1px solid transparent;
  background:#fff;
}
.stats-menu-item span{font-weight:800;color:#0f172a}
.stats-menu-item small{font-size:12px;line-height:1.35;color:#64748b}
.stats-menu-item:hover,.stats-menu-item.is-active{
  background:#f8fbff;
  border-color:#d7e7ff;
  text-decoration:none;
}

/* KPI compact */
.kpi-topline{align-items:flex-start}
.kpi-value-top{
  margin:0;
  font-size:1.7rem;
  font-weight:900;
  letter-spacing:-.03em;
  line-height:1;
}
.kpi-badge{display:none !important}
.kpi-card{padding:16px 18px}
.kpi-card.kpi-pendientes .kpi-value-top{color:var(--warning)}
.kpi-card.kpi-proceso .kpi-value-top{color:var(--primary)}
.kpi-card.kpi-completadas .kpi-value-top{color:var(--success)}
.kpi-card.kpi-incidencias .kpi-value-top{color:var(--danger)}
.kpi-card.kpi-incidencias .kpi-value-top:not(:empty){text-shadow:0 0 0 rgba(0,0,0,0)}

.kpi-topline-inline{display:flex;align-items:center;justify-content:space-between;gap:12px}
.kpi-topline-inline .kpi-label{margin:0;flex:1}
.kpi-value-inline{margin:0;text-align:right;line-height:1;white-space:nowrap}
.kpi-filtro-inline{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding-top:16px;
}
.kpi-filtro-inline .kpi-label{
  margin:0;
  white-space:nowrap;
}
.kpi-filtro-inline select{
  width:auto;
  min-width:150px;
  margin:0;
  padding:9px 12px;
}
.filter-card{
  flex-direction:row;
  align-items:center;
}
.filter-card label{display:none}
.filter-card select{margin-top:0}

/* Operativa header */
.operativa-title{color:var(--primary)}
.operativa-refresh-box{
  cursor:pointer;
  user-select:none;
}
.operativa-refresh-box:hover .service-badge{
  border-color:#bcd0ff;
  background:#f2f6ff;
}
.service-badge{gap:10px}
.service-countdown{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:56px;padding:6px 10px;border-radius:999px;
  background:rgba(29,78,216,.1);color:var(--primary);font-weight:800;
}
@media (max-width:860px){
  .kpi-filtro-inline{align-items:flex-start;flex-direction:column}
  .filter-card{align-items:flex-start}
  .kpi-filtro-inline select{width:100%}
}

.kpi-card{
  position:relative;
  overflow:hidden;
}

/* PENDENTS */
.kpi-card.kpi-pendientes{
  background:linear-gradient(135deg, #fff7ed, #fff);
  border-left:6px solid var(--warning);
}
.kpi-card.kpi-pendientes .kpi-value-inline{
  color:var(--warning);
}

/* EN PROCÉS */
.kpi-card.kpi-proceso{
  background:linear-gradient(135deg, #eff6ff, #fff);
  border-left:6px solid var(--primary);
}
.kpi-card.kpi-proceso .kpi-value-inline{
  color:var(--primary);
}

/* COMPLETADES */
.kpi-card.kpi-completadas{
  background:linear-gradient(135deg, #ecfdf5, #fff);
  border-left:6px solid var(--success);
}
.kpi-card.kpi-completadas .kpi-value-inline{
  color:var(--success);
}

/* INCIDÈNCIES */
.kpi-card.kpi-incidencias{
  background:linear-gradient(135deg, #fef2f2, #fff);
  border-left:6px solid var(--danger);
}
.kpi-card.kpi-incidencias .kpi-value-inline{
  color:var(--danger);
}

.kpi-value-inline{
  font-size:1.6rem;
  font-weight:900;
  letter-spacing:-0.02em;
}

/* Modal parte optimitzat */
.modal-part{
  display:none;
}
.modal-part-header{margin-bottom:14px}
.modal-part-summary{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
.modal-part-summary-full{grid-column:1 / -1}
.compact-detail{
  min-height:72px;
  padding:12px 14px;
}
.compact-detail span{
  display:block;
  font-weight:700;
  color:var(--text);
  line-height:1.35;
}
.compact-detail .status-pill{display:inline-flex}
.modal-part-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  align-items:start;
  margin-bottom:14px;
}
.modal-panel{
  margin-bottom:0;
  padding:18px;
}
.modal-stack-form{height:100%;display:flex;flex-direction:column}
.compact-stack>*+*{margin-top:12px}
.row-tight{margin-bottom:12px;gap:12px}
.two-col-fixed{display:grid;grid-template-columns:1fr 1fr}
.compact-link-area{margin-top:4px}
.compact-link-area label{display:block;margin-bottom:8px}
.modal-inline-actions{display:flex;justify-content:flex-end;margin-top:14px}
.modal-actions-panel{margin-bottom:0;padding:18px}
.modal-actions-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  align-items:stretch;
}
.modal-actions-grid form,
.modal-actions-grid > div{display:flex}
.action-btn-full{width:100%;justify-content:center}
#link-part-select{max-width:100%}
@media (max-width:860px){
  .modal{overflow:auto;max-height:90vh;padding:16px}
  .modal-part-summary{grid-template-columns:1fr 1fr}
  .modal-part-grid{grid-template-columns:1fr}
  .modal-actions-grid{grid-template-columns:1fr}
  .two-col-fixed{grid-template-columns:1fr}
}
@media (max-width:560px){
  .modal-part-summary{grid-template-columns:1fr}
}

.modal-secondary-form{margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}
.secondary{background:#fff!important;color:var(--primary-2)!important;border:1px solid var(--border)!important;box-shadow:none!important}

/* Dividir parts en línia amb salt automàtic */
.split-inline-row{
  display:flex;
  align-items:flex-start;
  gap:12px;
  flex-wrap:wrap;
}

.split-count-box{
  flex:0 0 180px;
  min-width:180px;
}

.split-count-box label{
  display:block;
  margin-bottom:8px;
}

.split-count-box input{
  width:100%;
}

.split-parts-inline{
  flex:1 1 420px;
  min-width:0;
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:flex-start;
}

.split-part-field{
  flex:0 0 150px;
  min-width:140px;
  max-width:170px;
}

.split-part-field label{
  display:block;
  margin-bottom:8px;
  white-space:nowrap;
}

.split-part-field input{
  width:100%;
}

.modal-inline-actions-between{
  justify-content:space-between;
}

@media (max-width:860px){
  .split-inline-row{
    flex-direction:column;
  }

  .split-count-box,
  .split-parts-inline{
    flex:1 1 100%;
    width:100%;
  }

  .split-part-field{
    flex:1 1 140px;
    max-width:none;
  }
}

/* Ajustos finals modal dividir */
.modal{
  overflow-y:auto;
  overflow-x:hidden;
}

.split-inline-row{
  display:flex;
  align-items:flex-end;
  gap:10px;
  flex-wrap:wrap;
}

.split-count-box{
  flex:0 0 auto;
  min-width:92px;
  max-width:110px;
}

.split-count-box input{
  width:78px;
  min-width:78px;
  padding:10px 10px;
  text-align:center;
}

.split-parts-inline{
  flex:1 1 auto;
  min-width:0;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:flex-end;
}

.split-part-field{
  flex:0 0 auto;
  min-width:72px;
  max-width:88px;
}

.split-part-field label{
  display:block;
  margin-bottom:6px;
  font-size:12px;
  white-space:nowrap;
}

.split-part-field input{
  width:72px;
  min-width:72px;
  padding:10px 8px;
  text-align:center;
}

#split-summary{
  margin-top:10px;
  margin-bottom:10px;
}

#split-form{
  min-width:0;
}

@media (max-width:860px){
  .modal{
    max-height:90vh;
    overflow-y:auto;
  }

  .split-inline-row{
    align-items:flex-start;
  }

  .split-count-box{
    min-width:82px;
    max-width:96px;
  }

  .split-count-box input,
  .split-part-field input{
    width:68px;
    min-width:68px;
  }

  .split-part-field{
    min-width:68px;
    max-width:84px;
  }
}
.split-submit-inline{
  display:flex;
  align-items:flex-end;
}

.split-submit-inline button{
  height:42px;
  padding:8px 14px;
  border-radius:10px;
  font-size:13px;
  white-space:nowrap;
}

.button-close,
.btn-close,
.close-btn{
  background:#c1c1c1 !important;
  color:#334155 !important;
  border:1px solid #d9e2f0 !important;
  box-shadow:none !important;
}

.button-close:hover,
.btn-close:hover,
.close-btn:hover{
  background:#c1c1c1 !important;
}

.compact-detail strong{
    display:block;
    margin-bottom:4px;
}

.compact-detail div{
    white-space: nowrap;
}
.doc-centro-line{
  white-space:nowrap;
}

.doc-centro-line span{
  display:inline;
}

.doc-centro-line .sep{
  font-weight:700;
}
.cliente-wide{
  grid-column: span 2;
}


.route-pin span{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:100%;
  border-radius:999px 999px 999px 0;
  transform:rotate(-45deg);
  color:#fff;
  font-size:10px;
  font-weight:800;
  box-shadow:0 8px 18px rgba(15,23,42,.28);
  border:2px solid #fff;
}
.route-pin span::first-line{transform:rotate(45deg)}
.route-pin span{line-height:1;}
.route-pin span > *{transform:rotate(45deg)}
.route-pin-start span{background:#2563eb;}
.route-pin-delivery span{background:#f59e0b; width:38px; height:38px; font-size:11px;}
.route-pin-end span{background:#16a34a;}
.route-pin-start span,
.route-pin-delivery span,
.route-pin-end span{transform:rotate(-45deg);}
.route-pin-start span::after,
.route-pin-delivery span::after,
.route-pin-end span::after{content:'';}


.route-btn {
    background: linear-gradient(135deg, #1e88e5, #42a5f5);
    color: #fff;
    font-weight: 600;
    padding: 10px 16px;
    border: none;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow: 0 3px 10px rgba(0,0,0,0.15);
}

.route-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0,0,0,0.25);
}

.route-btn i {
    font-size: 14px;
}.qr-print-btn{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    width:100%;
    padding:10px 12px;
    border-radius:12px;
    background:#0f172a;
    color:#fff;
    text-decoration:none;
    font-weight:700;
    font-size:14px;
    box-sizing:border-box;
}
.qr-print-btn:hover{filter:brightness(1.08);}

/* ============================= */
/* TORERO + FORKLIFT ICON */
/* ============================= */
.torero-cell{
  display:inline-flex;
  align-items:center;
  gap:7px;
  white-space:nowrap;
}
.forklift-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:24px;
  height:24px;
  border-radius:999px;
  background:#eef4ff;
  border:1px solid #bfd6ff;
  font-size:14px;
  line-height:1;
  opacity:.95;
}

/* ============================= */
/* FILES EN PROCES */
/* ============================= */
.row-en-proceso td{
  background:#e4f0ff !important;
  color:#165dc6;
  font-weight:600;
}
.row-en-proceso:hover td{
  background:#d8e8ff !important;
}
.row-en-proceso .muted{
  color:#4f74a8;
}
.row-en-proceso .badge-EN_PROCES,
.row-en-proceso .status-EN_PROCES,
.row-en-proceso .estat-EN_PROCES{
  background:#d8e8ff;
  border-color:#9fc5ff;
  color:#0f4fb5;
}