@font-face {
  font-family: "Open Sans";
  src: url("./fonts/open-sans.woff2") format("woff2");
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
}
:root {
  --teal: #397c83;
  --teal-dark: #2d666d;
  --gold: #fac513;
  --ink: #3e3e3e;
}
:root{font-family:"Open Sans",Arial,sans-serif;color:var(--ink);background:#f5f8f8}*{box-sizing:border-box}body{margin:0}main{max-width:1180px;margin:45px auto;padding:0 24px}header{margin-bottom:30px}.brand{letter-spacing:3px;font-size:12px;font-weight:750;color:var(--teal-dark)}h1{font-size:clamp(32px,5vw,52px);letter-spacing:-2px;margin:14px 0}p{line-height:1.6;color:#48595a}nav{display:flex;gap:8px;margin-bottom:24px;flex-wrap:wrap}button{font:inherit;border:0;border-radius:9px;padding:13px 20px;background:var(--teal-dark);color:white;cursor:pointer}button:disabled{opacity:.5;cursor:wait}nav button{background:#e5f0f1;color:var(--teal-dark)}nav button[aria-current=step]{background:var(--teal-dark);color:white}section{background:white;border:1px solid #ccdfe1;border-radius:18px;padding:30px;box-shadow:0 8px 30px #18393c12}h2{margin-top:0}label{display:block;font-size:14px;font-weight:650}input{display:block;width:100%;font:inherit;padding:11px;border:1px solid #8daeb2;border-radius:6px;margin:8px 0 20px;background:white}input[type=checkbox]{display:inline;width:auto;margin:8px;accent-color:var(--teal-dark)}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:0 24px}.upload{padding:28px;background:#edf5f5;border:2px dashed var(--teal);border-radius:12px;margin-bottom:20px}.scroll{overflow:auto;max-height:520px}table{border-collapse:collapse;width:100%;margin:16px 0}th,td{text-align:left;padding:10px;border-bottom:1px solid #d6e4e5}th{background:#e5f0f1;position:sticky;top:0}td input{min-width:130px;margin:0}td:first-child input{min-width:0}#days label{display:inline-block;padding:10px;margin:5px;background:#edf5f5;border-radius:8px}#days input[type=number]{width:80px;display:inline;margin:0}footer{font-size:13px;margin:24px 0;color:#48595a}#status:not(:empty){padding:14px;background:#fff5ce;border-radius:8px}.confirm{margin:20px 0}a{color:var(--teal-dark)}[hidden]{display:none!important}
.suggestion{padding:20px;margin:22px 0 12px;background:#fff7da;border-left:4px solid var(--gold);border-radius:8px;line-height:1.7}
.secondary{background:#e5f0f1;color:var(--teal-dark);margin:8px 8px 16px 0}
.week{border:1px solid #ccdfe1;border-radius:12px;margin:22px 0;padding:16px}
.week legend{font-weight:700;padding:0 8px}.day-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}
#days label.day{display:flex;flex-direction:column;gap:12px;margin:0;padding:14px;border:1px solid #ccdfe1;background:#f7fafa;font-weight:500}
#days label.selected{background:#e5f0f1;border-color:var(--teal)}.hours-field{font-size:12px;color:#48595a}
#days input[type=number]{width:65px;padding:8px;margin-right:6px}
button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--teal-dark);outline-offset:3px}
#summary table td,#summary table th{padding:14px}#summary tr:nth-child(even){background:#f2f7f7}
@media(max-width:600px){main{padding:0 14px;margin:20px auto}section{padding:20px}nav button{flex:1;padding:12px 8px;font-size:13px}.day-grid{grid-template-columns:1fr}}

.finish-time{border:0;padding:0;margin:0 0 20px;min-width:0}.finish-time legend{font-size:14px;font-weight:650;padding:0;margin-bottom:8px}.finish-time>div{display:flex;gap:8px}.finish-time label{flex:1;font-size:12px}.finish-time select{display:block;width:100%;margin-top:4px;padding:8px;border:1px solid #8daeb2;border-radius:6px;font:inherit;background:white;color:inherit}

body { border-top: 5px solid var(--gold); }
nav button[aria-current="step"] { box-shadow: inset 0 -3px var(--gold); }
button:not(:disabled):hover { filter: brightness(.94); }
select:focus-visible { outline: 3px solid var(--teal-dark); outline-offset: 3px; }
input::file-selector-button {
  font: inherit;
  color: var(--ink);
  background: #fff5ce;
  border: 1px solid #b58d14;
  border-radius: 6px;
  padding: 7px 12px;
  margin-right: 10px;
  cursor: pointer;
}
