/* Endurance Lab 13.0 · Account-specific appearance and personalisation.
 * Original palette is untouched by default. Custom palettes adjust broad app
 * surfaces while maintaining readable dark-mode content and focus styles. */
.ap-panel{margin-bottom:22px;border-color:rgba(154,199,186,.3)!important}
.ap-heading{display:flex;justify-content:space-between;align-items:start;gap:15px}
.ap-heading h2{font-size:24px;letter-spacing:-.03em;margin:7px 0 9px}
.ap-heading p{font-size:13px;line-height:1.6;color:var(--muted);max-width:670px}
.ap-heading-mark{flex:none;font-size:10px;font-weight:850;letter-spacing:.07em;color:var(--lime);
 border:1px solid var(--border);border-radius:100px;padding:9px 11px}
.ap-presets{margin:14px 0 21px;border:0;padding:0}
.ap-presets legend{font-size:12px;color:var(--soft);font-weight:850;margin-bottom:11px}
.ap-preset-list{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}
.ap-preset{position:relative;cursor:pointer;min-width:0}
.ap-preset input{position:absolute;width:1px;height:1px;opacity:0}
.ap-preset-card{display:flex;flex-direction:column;gap:9px;align-items:center;text-align:center;
 border:1px solid var(--border);border-radius:12px;background:rgba(42,64,79,.35);padding:12px 7px;
 min-height:105px;color:var(--soft);font-size:11px;font-weight:800;transition:border-color .15s,transform .15s}
.ap-preset input:checked+.ap-preset-card{border-color:var(--lime);box-shadow:0 0 0 2px color-mix(in srgb,var(--lime) 18%,transparent)}
.ap-preset input:focus-visible+.ap-preset-card{outline:3px solid var(--cyan);outline-offset:3px}
.ap-preset-card:hover{transform:translateY(-2px)}
.ap-swatch{display:block;height:45px;width:65px;max-width:100%;border-radius:9px;
 background:linear-gradient(140deg,var(--ap-swatch-bg) 58%,var(--ap-swatch-accent) 58%);border:2px solid rgba(255,255,255,.15)}
.ap-custom-swatch{display:flex;align-items:center;justify-content:center;font-size:23px;color:var(--lime);
 background:#233b4a}
.ap-config{display:grid;grid-template-columns:1fr 1.1fr;gap:14px;margin-bottom:20px}
.ap-config>div{background:rgba(24,47,61,.5);border:1px solid var(--border);padding:18px;border-radius:12px}
.ap-config h3{font-size:15px;margin-bottom:6px}
.ap-config p{font-size:11px;color:var(--muted);line-height:1.6;margin-bottom:16px}
.ap-color-inputs{display:flex;flex-wrap:wrap;gap:20px}
.ap-color-inputs>label{min-width:135px;flex:1 1 150px}
.ap-config label{display:flex;flex-direction:column;gap:8px;color:var(--soft);font-size:12px;font-weight:800}
.ap-config label small{font-size:11px;color:var(--muted);font-weight:500;line-height:1.4}
.ap-config input[type=color]{appearance:none;border:1px solid var(--border);border-radius:9px;background:#1c3644;
 width:100%;height:49px;padding:4px;cursor:pointer}
.ap-layout{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ap-layout h3{grid-column:1/-1;margin:0}
.ap-layout label:last-child{grid-column:1/-1}
.ap-layout select{padding:10px;border-radius:9px;background:#142d3d;border:1px solid #466879;color:#eaf7fa;
 min-height:42px;width:100%}
.ap-preview{--ap-demo-bg:#0b1220;--ap-demo-accent:#ccf185;display:flex;align-items:center;border-radius:14px;
 min-height:145px;padding:21px 24px;background:radial-gradient(circle at 88% 12%,color-mix(in srgb,var(--ap-demo-accent) 16%,transparent),transparent 48%),var(--ap-demo-bg);
 border:1px solid color-mix(in srgb,var(--ap-demo-accent) 36%,transparent)}
.ap-preview small{font-size:10px;letter-spacing:.13em;font-weight:850;color:var(--ap-demo-accent)}
.ap-preview h3{font-size:23px;color:#f0f7fa;margin:5px 0}
.ap-preview p{color:#bdd3dc;font-size:12px;margin:0 0 11px}
.ap-preview-action{display:inline-flex;color:#172319;background:var(--ap-demo-accent);border-radius:8px;
 font-size:11px;font-weight:850;padding:8px 13px}
.ap-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:17px}
.ap-actions>.btn{min-height:42px}
.ap-actions>p{font-size:11px;color:#a8c3d2;line-height:1.5;flex:1 1 250px;margin:0}
.ap-actions>p.ap-error{color:#ffc4c6}
/* Global backgrounds; keep original style untouched when no custom colour is selected. */
html[data-el-colored="true"] body{background:var(--el-bg)!important}
html[data-el-colored="true"] .sidebar,
html[data-el-colored="true"] .mobile-tabs{background:var(--el-sidebar)!important;border-color:var(--el-border)!important}
html[data-el-colored="true"] .main{background:transparent}
html[data-el-colored="true"] .panel,
html[data-el-colored="true"] .hero,
html[data-el-colored="true"] .cal-top,
html[data-el-colored="true"] .cal-day,
html[data-el-colored="true"] .week-quick-card,
html[data-el-colored="true"] .week-expandable,
html[data-el-colored="true"] .week-expandable>summary,
html[data-el-colored="true"] .cs-feature-head,
html[data-el-colored="true"] .cs-section,
html[data-el-colored="true"] .cs-kpi,
html[data-el-colored="true"] .cs-settings,
html[data-el-colored="true"] .cs-legacy,
html[data-el-colored="true"] .ap-config>div,
html[data-el-colored="true"] .ac-panel,
html[data-el-colored="true"] .ac-advice,
html[data-el-colored="true"] .insights-studio,
html[data-el-colored="true"] .week-review-content,
html[data-el-colored="true"] .week-review-content .panel{
 background:linear-gradient(145deg,var(--el-panel2),var(--el-panel))!important;
 border-color:var(--el-border)!important}
html[data-el-colored="true"] .nav button.active,
html[data-el-colored="true"] .nav button:hover{background:var(--el-panel2)!important}
html[data-el-colored="true"] .btn:not(.primary),
html[data-el-colored="true"] .badge{border-color:var(--el-border)}
html[data-el-colored="true"] .btn.primary{background:var(--el-accent)!important;
 border-color:var(--el-accent)!important;color:#172319!important}
html[data-el-colored="true"] .eyebrow,
html[data-el-colored="true"] .week-text-action{color:var(--el-accent)!important}
html[data-el-colored="true"] .week-coach-rest{border-color:#e9bc9b!important}
/* App-wide density; avoid changing calendar layout semantics or drag/drop hit areas. */
html[data-el-density="compact"] .main{padding-top:18px}
html[data-el-density="compact"] .panel-pad{padding:16px}
html[data-el-density="compact"] .topbar{margin-bottom:20px}
html[data-el-density="compact"] .page-head{margin-bottom:15px}
html[data-el-density="compact"] .activity-card{padding:12px}
html[data-el-density="compact"] .week-quick-card{padding:13px}
html[data-el-density="compact"] .cal-day{padding:9px}
html[data-el-density="compact"] .nav button{padding-block:9px}
html[data-el-density="spacious"] .main{padding-top:48px}
html[data-el-density="spacious"] .panel-pad{padding:30px}
html[data-el-density="spacious"] .topbar{margin-bottom:46px}
html[data-el-density="spacious"] .page-head{margin-bottom:34px}
html[data-el-density="spacious"] .activity-card{padding:22px}
html[data-el-density="spacious"] .week-quick-card{padding:25px}
html[data-el-density="spacious"] .cal-day{padding:18px}
html[data-el-density="spacious"] .nav button{padding-block:17px}
html[data-el-text="large"] body{font-size:16px}
html[data-el-text="large"] .page-head p,html[data-el-text="large"] .panel p{font-size:clamp(13px,1.05em,16px)}
html[data-el-text="large"] .btn,html[data-el-text="large"] .nav button{font-size:15px}
html[data-el-text="large"] .muted{font-size:14px}
html[data-el-motion="reduce"] *,html[data-el-motion="reduce"] *::before,
html[data-el-motion="reduce"] *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
@media(max-width:900px){.ap-preset-list{grid-template-columns:repeat(4,minmax(0,1fr))}
 .ap-config{grid-template-columns:1fr}}
@media(max-width:550px){.ap-heading-mark{display:none}.ap-panel{padding:17px!important}
 .ap-preset-list{grid-template-columns:repeat(3,minmax(0,1fr))}
 .ap-preset-card{padding:10px 4px;min-height:96px}
 .ap-swatch{width:58px;height:39px}
 .ap-layout{grid-template-columns:1fr}.ap-layout h3,.ap-layout label:last-child{grid-column:auto}
 .ap-preview{padding:16px}.ap-actions .btn{flex:1 1 150px}}
