/* La barra lateral comparte el fondo teal del logo provisional original. */
:root {
  --primary:#15545b; --primary-hover:#103f45; --accent:#d8bf8d;
  --background:#f6f5f1; --surface:#fff; --text:#233c40; --muted:#627276;
  --border:#dfe4e1; --error:#a42e32; --nav-active:#28676d;
  --sidebar-background:#016b82; --sidebar-width:256px; --radius:14px;
}
* { box-sizing:border-box; }
html { font-size:16px; }
body { margin:0; background:var(--background); color:var(--text); font:16px/1.65 system-ui,-apple-system,sans-serif; }
a { color:var(--primary); text-underline-offset:4px; overflow-wrap:anywhere; }
.authenticated { min-height:100vh; }
.sidebar { position:fixed; inset:0 auto 0 0; width:var(--sidebar-width); height:100dvh; display:flex; flex-direction:column; padding:36px 22px 24px; background:var(--sidebar-background); color:#fff; overflow-y:auto; }
.brand-container { min-width:0; padding:0 16px 32px; }
.brand { display:block; line-height:1.2; color:var(--primary); }
.sidebar .brand { color:#fff; }
.brand-name { display:block; font-size:32px; font-weight:750; letter-spacing:-1px; }
.brand-description { display:block; font-size:14px; font-weight:450; letter-spacing:1.3px; margin-top:6px; }
.brand-container img { display:block; max-width:100%; height:auto; }
.sidebar .brand-container { padding:0 0 28px; background:transparent; border:0; box-shadow:none; }
.sidebar .brand-logo { width:100%; height:auto; background:transparent; border:0; padding:0; box-shadow:none; }
.navigation { display:flex; flex-direction:column; flex:1; margin-top:28px; }
.navigation-content { display:flex; flex-direction:column; flex:1; gap:40px; }
nav { display:flex; flex-direction:column; gap:8px; }
nav a { display:block; padding:13px 16px; border-radius:8px; color:#e5efef; font-weight:550; text-decoration:none; border-left:3px solid transparent; }
nav a:hover { background:var(--primary-hover); color:#fff; }
nav a[aria-current="page"] { background:var(--nav-active); color:#fff; border-left-color:var(--accent); font-weight:700; }
.user-area { margin-top:auto; padding:24px 12px 0; border-top:1px solid #ffffff26; }
.user-caption { display:block; font-size:12px; color:#c2d7d7; letter-spacing:.04em; }
.user-name { display:block; overflow-wrap:anywhere; font-weight:600; margin:4px 0 16px; }
.sidebar button.secondary { width:100%; color:#fff; border-color:#ffffff42; background:transparent; text-align:left; padding:10px 14px; font-size:14px; }
.sidebar button.secondary:hover { background:#ffffff14; }
.sidebar :focus-visible { outline-color:var(--accent); }
.menu-toggle { display:none; }
.authenticated .page-content { margin-left:var(--sidebar-width); }
.page-content { min-width:0; min-height:100vh; display:flex; flex-direction:column; }
main { width:100%; max-width:1160px; padding:54px 56px 64px; margin:0 auto; flex:1; overflow-wrap:anywhere; }
h1 { font-size:clamp(30px,3vw,40px); line-height:1.2; margin:0 0 16px; letter-spacing:-1.2px; font-weight:700; }
h2 { font-size:21px; line-height:1.4; letter-spacing:-.3px; }
main > p { color:var(--muted); margin:0 0 24px; }
.eyebrow { color:var(--primary); letter-spacing:.15em; font-size:12px; font-weight:700; margin:0 0 14px; }
.lead { color:var(--muted); font-size:19px; }
.panel { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:32px; margin-top:28px; box-shadow:0 4px 18px #233c4005; }
.welcome .panel { border-top:3px solid var(--accent); max-width:780px; }
.panel h2 { margin:0 0 12px; }
.panel p:last-child { margin-bottom:0; }
.client-form { max-width:780px; }
.client-form > p { margin:0 0 22px; }
label { display:block; font-weight:600; font-size:14px; margin:0 0 8px; }
input, textarea, select { display:block; width:100%; max-width:100%; min-width:0; min-height:50px; padding:12px 14px; margin:0; border:1px solid #bac8c8; border-radius:8px; background:var(--surface); color:var(--text); font-family:inherit; font-size:16px; line-height:1.6; }
input:hover, textarea:hover, select:hover { border-color:var(--primary); }
textarea { min-height:200px; resize:vertical; }
button, .button-link { display:inline-flex; align-items:center; justify-content:center; min-height:48px; max-width:100%; padding:11px 22px; border:1px solid var(--primary); border-radius:8px; color:#fff; background:var(--primary); font:600 15px/1.5 system-ui,sans-serif; cursor:pointer; text-decoration:none; }
button:hover, .button-link:hover { background:var(--primary-hover); }
button.secondary { background:var(--surface); color:var(--primary); }
:focus-visible { outline:3px solid var(--primary); outline-offset:3px; }
.error, .errorlist { color:var(--error); }
.error[role="alert"] { background:#fff2f1; padding:14px 16px; border-radius:8px; border-left:3px solid var(--error); }
.errorlist { padding-left:20px; }
.helptext { display:block; color:var(--muted); font-size:13px; margin-top:6px; }
.form-actions { display:flex; flex-wrap:wrap; align-items:center; gap:24px; margin-top:30px; padding-top:24px; border-top:1px solid var(--border); }
.client-search { max-width:780px; padding:26px 28px; border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); }
.client-search input { margin-bottom:16px; }
.client-search button { margin-right:18px; }
.client-list { list-style:none; padding:0; margin-top:28px; max-width:900px; }
.client-list .panel { margin-top:14px; padding:24px 28px; }
.client-list h2 a { text-decoration:none; }
.client-list p { color:var(--muted); margin:6px 0; }
.client-list > li:not(.panel) { padding:32px; border:1px dashed #bac8c8; border-radius:var(--radius); color:var(--muted); background:#ffffff80; }
.client-detail { max-width:900px; }
.client-detail dl { margin:0 0 28px; }
.client-detail dt { font-size:13px; color:var(--muted); font-weight:600; margin-bottom:6px; }
.client-detail dd { margin:0 0 24px; padding-bottom:20px; border-bottom:1px solid var(--border); }
footer { padding:20px 32px; color:var(--muted); font-size:12px; border-top:1px solid var(--border); }
.skip-link { position:fixed; z-index:10; left:16px; top:-100px; background:var(--surface); padding:12px; }
.skip-link:focus { top:12px; }
.site-header { background:var(--surface); border-bottom:1px solid var(--border); }
.header-inner { max-width:1160px; margin:auto; padding:24px 40px; }
.header-inner .brand-container { padding:0; }
.login { max-width:460px; margin:20px auto; padding:36px; border-top:3px solid var(--accent); }
.login label { margin-top:22px; }
.login button { margin-top:28px; width:100%; }
body:not(.authenticated) .page-content { min-height:calc(100vh - 112px); }
@media(max-width:899px) {
  .sidebar { position:relative; inset:auto; width:100%; height:auto; padding:20px 24px; display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; }
  .sidebar .brand-container { border:0; padding:0; margin-right:20px; }
  .sidebar .brand-logo { width:190px; max-width:100%; }
  .brand-name { font-size:26px; }
  .brand-description { font-size:12px; }
  .menu-toggle { display:inline-flex; gap:8px; background:transparent; border-color:#ffffff42; padding:10px 14px; }
  .navigation { grid-column:1/-1; margin-top:0; }
  .navigation-content { display:none; }
  .menu-open .navigation-content { display:flex; padding-top:24px; gap:24px; }
  .user-area { padding:20px 16px 0; }
  .authenticated .page-content { margin-left:0; }
  main { padding:34px 24px 44px; }
  .panel { padding:24px; }
  .client-search { padding:24px; }
  footer { padding:20px 24px; }
}
@media(min-width:900px) and (max-width:1100px) { main { padding:44px 32px; } }
@media(max-width:480px) { main { padding:30px 18px 40px; } .panel, .client-search { padding:22px 20px; } .sidebar { padding:18px; } .login { margin:0 auto; } }

.agenda-filters { display:flex; flex-wrap:wrap; align-items:end; gap:16px; }
.agenda-filters > div { flex:1 1 180px; min-width:0; }
.agenda-week { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:16px; margin-top:24px; }
.agenda-day { margin:0; padding:20px; }
.agenda-entry { padding:16px 0; border-top:1px solid var(--border); overflow-wrap:anywhere; }
.agenda-entry p { margin:6px 0; }
.agenda-entry.cancelled { opacity:.7; }
@media(max-width:480px) { .agenda-week { grid-template-columns:minmax(0,1fr); } }

/* Agenda por horas: desplazamiento propio en pantallas estrechas. */
.address-fieldset { border:1px solid var(--border); border-radius:10px; padding:24px; margin:24px 0; min-width:0; }
.address-fieldset legend { font-weight:650; padding:0 8px; }
.address-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.address-street { grid-column:span 2; }
.address-locality { grid-column:span 2; }
.legacy-address { font-size:14px; background:var(--background); padding:14px; border-radius:8px; }
.calendar-selection { border-left:4px solid var(--accent); background:var(--surface); padding:18px 22px; border-radius:8px; }
.calendar-selection p { margin:6px 0; }
.calendar-toolbar { display:flex; flex-wrap:wrap; gap:24px; justify-content:space-between; margin:24px 0 16px; }
.calendar-help { font-size:14px; color:var(--muted); }
.calendar-key { display:inline-block; padding:3px 8px; margin:6px 0 0 8px; border-radius:5px; }
.measurement-key { background:#dceff1; color:#15545b; }
.installation-key { background:#f5e8cd; color:#664b18; }
.calendar-scroll { max-width:100%; overflow-x:auto; border:1px solid var(--border); background:var(--surface); border-radius:12px; }
.time-calendar { display:grid; grid-template-columns:58px repeat(7,minmax(112px,1fr)); min-width:842px; padding-bottom:16px; }
.time-heading, .calendar-heading { padding:12px 6px; text-align:center; border-bottom:1px solid var(--border); font-size:13px; background:#f1f5f3; }
.calendar-heading strong { display:block; font-size:16px; }
.calendar-times, .calendar-column { position:relative; height:640px; }
.calendar-times span { position:absolute; right:7px; transform:translateY(-50%); font-size:12px; color:var(--muted); }
.calendar-times span:first-child { transform:translateY(0); }
.calendar-column { border-left:1px solid var(--border); }
.calendar-slots { display:grid; grid-template-rows:repeat(32,20px); }
.calendar-slot { display:block; border-top:1px solid #edf0ee; text-decoration:none; }
.calendar-slot:nth-child(4n+1) { border-top-color:#cbd7d3; }
.calendar-slot:nth-child(2n+1) { border-top-color:#dfe4e1; }
.calendar-slot span { font-size:11px; padding:2px 6px; opacity:0; }
a.calendar-slot:hover, a.calendar-slot:focus-visible { background:#e0eff0; }
a.calendar-slot:hover span, a.calendar-slot:focus-visible span { opacity:1; }
.calendar-event { position:absolute; z-index:1; display:flex; flex-direction:column; padding:4px 6px; border:1px solid #fff; border-left:3px solid #016b82; border-radius:5px; font-size:11px; line-height:1.4; text-decoration:none; overflow:auto; background:#dceff1; color:#154951; }
.calendar-event.installation { background:#f5e8cd; color:#664b18; border-left-color:#b18c45; }
.calendar-event strong { font-size:11px; }
.calendar-event small { font-size:10px; }
@media(max-width:600px) { .address-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .address-street { grid-column:1/-1; } .address-fieldset { padding:18px; } }
@media(max-width:380px) { .address-grid { grid-template-columns:minmax(0,1fr); } .address-locality, .address-street { grid-column:auto; } }

.calendar-slot.short-slot { background:#f4f5f3; }

.calendar-legend { display:flex; flex-wrap:wrap; gap:10px; margin:0 0 18px; }
.calendar-legend .calendar-key { margin:0; }

.client-work-summary { margin-top:18px; padding-top:16px; border-top:1px solid var(--border); }
.work-badges { display:flex; flex-wrap:wrap; gap:8px; }
.work-badge { display:inline-block; border-radius:6px; padding:5px 10px; font-size:13px; font-weight:600; }
.work-badge.neutral { background:#edf0ee; color:#52666a; }
.work-badge.pending { background:#f5e8cd; color:#664b18; }
.work-badge.scheduled { background:#dceff1; color:#154951; }
.work-badge.done { background:#e1ede1; color:#315f38; }
.work-badge.installation { background:#f5e8cd; color:#664b18; }
.client-work-summary .next-measurement { font-size:14px; margin:12px 0 0; }

.quotation-filter button { margin-top:18px; }

.appointment-status { display:inline-flex; align-items:center; gap:5px; font-size:13px; font-weight:700; }.appointment-status.done { color:#24532c; }.appointment-status.cancelled { color:#943333; }.appointment-status.scheduled { color:#384a50; }.calendar-event.status-done { border-left-style:double; border-left-width:6px; }.calendar-event .appointment-status { font-size:11px; }.calendar-event .appointment-status > span { display:inline; font-size:15px; }