/***************************************************************************************************************************/
/**
 * \brief Applies Recovrr's app colors, HSL gradient, system typography, and adaptive grouped surfaces.
 * © Copyright 2026, Little Green Viper Software Development LLC
 */
:root {
    color-scheme: light; --bg:#f6f6f6; --surface:#fff; --inset:#f3f3f7; --text:#1c1c1e; --muted:#64646d;
    --line:#dfdfe5; --accent:#276ca2; --focus:#9543d4; --purple:#7925a8; --tag:#f2eafa; --error:#a92337;
    /** \brief Samples the app's HSL interpolation between GradientStartColor (#9543D4) and GradientEndColor (#68E4DA). */
    --brand-stops:#9543d4 0.000%,#8e44d5 3.226%,#8745d5 6.452%,#8146d6 9.677%,#7a48d6 12.903%,#7349d7 16.129%,#6d4ad7 19.355%,#664bd8 22.581%,#604cd8 25.806%,#5a4dd9 29.032%,#534fda 32.258%,#5052da 35.484%,#515bdb 38.710%,#5263db 41.935%,#536cdc 45.161%,#5474dc 48.387%,#567cdd 51.613%,#5784dd 54.839%,#588cde 58.065%,#5994de 61.290%,#5a9cdf 64.516%,#5ca4df 67.742%,#5dace0 70.968%,#5eb3e0 74.194%,#5fbbe1 77.419%,#61c3e1 80.645%,#62cae2 83.871%,#63d1e2 87.097%,#64d9e3 90.323%,#66e0e3 93.548%,#67e4e0 96.774%,#68e4da 100.000%;
    --brand:linear-gradient(135deg,var(--brand-stops));
    --shadow:0 10px 35px rgb(25 25 45 / 4%);
    /** \brief Anchors the hue transition to opposite corners so wide headers retain visible horizontal and vertical color changes. */
    --header-gradient:linear-gradient(to bottom right,var(--brand-stops));
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; font-size:16px;
}
@supports(background:linear-gradient(to bottom right in hsl shorter hue,magenta,cyan)){
    :root{--header-gradient:linear-gradient(to bottom right in hsl shorter hue,#9543d4,#68e4da)}
}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){color-scheme:dark;--bg:#101010;--surface:#1c1c1e;--inset:#28282d;--text:#f3f3f6;--muted:#b0b0ba;--line:#39393f;--accent:#70b5e8;--focus:#c28bed;--purple:#cf9cf1;--tag:#332340;--error:#ff9aaa;--shadow:none}}
:root[data-theme="dark"]{color-scheme:dark;--bg:#101010;--surface:#1c1c1e;--inset:#28282d;--text:#f3f3f6;--muted:#b0b0ba;--line:#39393f;--accent:#70b5e8;--focus:#c28bed;--purple:#cf9cf1;--tag:#332340;--error:#ff9aaa;--shadow:none}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);line-height:1.5}
[hidden]{display:none!important}button,input,select{font:inherit}button,a,input,select,summary{-webkit-tap-highlight-color:transparent}
a{color:var(--accent);text-underline-offset:3px}button{cursor:pointer}button:disabled{cursor:wait;opacity:.6}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip-link{position:absolute;left:1rem;top:-100px;z-index:10;padding:1rem;background:var(--surface)}.skip-link:focus{top:1rem}
.topbar{background:var(--header-gradient);color:#210044}.topbar-inner{max-width:1200px;margin:auto;min-height:88px;padding:16px 32px;display:grid;grid-template-columns:minmax(56px,1fr) minmax(0,240px) minmax(136px,1fr);align-items:center;gap:12px}
/** \brief Enlarges the app's title for the web header, shrinking only when the icon and appearance controls need the space. */
.brand{display:flex;align-items:center;justify-content:center;min-width:0;min-height:44px;text-decoration:none;color:#210044}
.wordmark{display:block;width:240px;max-width:100%;height:auto}
.logo{display:block;flex:none;width:56px;height:56px;background:#000;border-radius:28%;overflow:hidden}.logo img,.welcome-symbol img{display:block;width:100%;height:100%}
/** \brief Keeps three dark appearance icons readable against the header, with accessible touch targets and a visible selection. */
.theme-controls{display:flex;justify-self:end;gap:2px}.theme-controls button{display:grid;place-items:center;width:44px;height:44px;padding:10px;border:1px solid transparent;border-radius:11px;background:transparent;color:#210044}
.theme-controls svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.theme-controls button:hover{background:#ffffff40}.theme-controls button[aria-pressed="true"]{background:#ffffff50;border-color:#21004455}.theme-controls button:focus-visible{outline-color:#210044}
main{max-width:1200px;margin:auto;padding:0 32px}.intro{padding:48px 0 34px}.eyebrow{font-size:11px;letter-spacing:1.65px;font-weight:750;color:var(--purple);margin:0 0 10px}
h1{font-size:clamp(34px,4.3vw,52px);line-height:1.08;letter-spacing:-1.8px;font-weight:750;margin:0 0 18px}h1 .subheading{color:var(--muted);font-weight:450}
.intro>p:last-child{font-size:16px;color:var(--muted);margin:0;line-height:1.65}
.workspace{display:grid;grid-template-columns:350px minmax(0,1fr);gap:30px;align-items:start}
.search-panel{min-width:0;background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:24px;box-shadow:var(--shadow)}
fieldset{border:0;padding:0;margin:0;min-width:0}legend,label{font-size:13px;font-weight:650}label:not(.mode-picker label,.weekdays label,.check-row){display:block;margin-bottom:7px}
input[type="text"],input[type="time"],select{width:100%;min-width:0;padding:11px 12px;border-radius:10px;border:1px solid var(--line);background:var(--inset);color:var(--text);min-height:46px}
input[type="checkbox"],input[type="radio"]{accent-color:var(--purple)}
.mode-picker{display:grid;grid-template-columns:1fr 1fr;border-radius:12px;padding:4px;background:var(--inset);gap:3px}
.mode-picker label,.weekdays label{position:relative;cursor:pointer}.mode-picker input,.weekdays input{position:absolute;opacity:0;width:1px;height:1px}
.mode-picker span{display:block;text-align:center;padding:9px 4px;border-radius:9px;font-size:14px;font-weight:650}
.mode-picker input:checked+span{background:var(--surface);box-shadow:0 1px 5px #0002;color:var(--purple)}
.mode-picker input:focus-visible+span,.weekdays input:focus-visible+span{outline:3px solid var(--focus);outline-offset:2px}
.hint{color:var(--muted);font-size:12px;line-height:1.55;margin:9px 0 18px}
.field-heading{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-top:20px;margin-bottom:7px}.field-heading label{margin:0!important}
.text-button{border:0;background:none;color:var(--accent);padding:4px 0;font-size:12px;font-weight:600}
.two-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:16px}
.weekdays{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;margin-top:20px}.weekdays legend{margin-bottom:9px;width:100%}
.weekdays span{display:grid;place-items:center;width:100%;height:44px;font-size:11px;border:1px solid var(--line);border-radius:9px;background:var(--inset)}
.weekdays input:checked+span{background:var(--tag);border-color:var(--purple);color:var(--purple);font-weight:750}
.check-row{display:flex;gap:8px;align-items:center;margin-top:12px}
.time-settings{margin:20px 0;font-size:12px;color:var(--muted)}summary{cursor:pointer;line-height:1.65}.time-settings[open]>label{margin-top:14px}
.primary{display:flex;justify-content:space-between;align-items:center;width:100%;min-height:50px;padding:12px 17px;border:0;border-radius:13px;background:linear-gradient(#ffffff40,#ffffff40),var(--brand);color:#210044;font-weight:750;font-size:15px}
.primary span:last-child{font-size:22px}.cancel{display:block;background:none;border:0;color:var(--accent);margin:12px auto 0;min-height:36px}
.results-panel{min-width:0}.results-heading{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;padding:3px 0 13px;border-bottom:2px solid transparent;border-image:var(--brand) 1}
.results-heading .eyebrow{margin-bottom:5px}h2{margin:0;letter-spacing:-.6px;font-size:26px;line-height:1.3}.result-count{color:var(--muted);font-size:14px;font-weight:500}
#status{font-size:14px;color:var(--muted);margin:16px 0}#status:empty{display:none}#status.error{color:var(--error)}#status.busy::before{content:"";display:inline-block;width:12px;height:12px;border:2px solid var(--line);border-top-color:var(--purple);border-radius:50%;margin-right:9px;animation:spin 1s linear infinite;vertical-align:-2px}
@keyframes spin{to{transform:rotate(360deg)}}.welcome{border:1px dashed var(--line);border-radius:22px;text-align:center;padding:42px 20px;margin-top:24px;background:var(--surface)}
.welcome-symbol{width:88px;height:88px;border-radius:28%;background:#000;margin:0 auto 22px;overflow:hidden}
.welcome h3{font-size:21px;font-weight:600;letter-spacing:-.5px;margin:0 0 10px}.welcome p{font-size:14px;color:var(--muted);line-height:1.75;margin:0}
.welcome-tags{display:flex;gap:8px;justify-content:center;margin-top:23px}.welcome-tags span,.badge{font-size:11px;font-weight:600;border-radius:6px;padding:4px 8px;background:var(--inset);color:var(--muted)}
.meetings{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:13px}
.meeting{background:var(--surface);border:1px solid var(--line);border-radius:17px;padding:20px;box-shadow:var(--shadow);display:grid;grid-template-columns:46px minmax(0,1fr);gap:14px}
/** \brief Displays ordinal numbers as plain text; list-item values continue numbering on later pages. */
.meeting::before{content:attr(value);align-self:start;padding-top:1px;color:var(--muted);font-size:15px;font-weight:500;font-variant-numeric:tabular-nums}
/** \brief Keeps page information plain while giving Previous and Next clear, accessible controls. */
.pagination{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px;margin-top:18px}
.pagination span{text-align:center;color:var(--muted);font-size:13px}.pagination button{min-height:44px;padding:9px 14px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--accent);font-size:14px;font-weight:650}
.pagination button:hover:enabled{background:var(--tag)}.pagination button:disabled{cursor:default;color:var(--muted);opacity:.5}
/** \brief Makes the nearby sort choice explicit without giving the result count a control-like appearance. */
.result-sort{display:flex;align-items:center;gap:6px;margin-top:18px}.result-sort>span{font-size:13px;color:var(--muted);margin-right:6px}
.result-sort button{min-height:44px;padding:9px 14px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--accent);font-size:14px;font-weight:650}
.result-sort button[aria-pressed="true"]{background:var(--tag);border-color:var(--purple);color:var(--purple)}
.meeting h3{margin:1px 0 6px;font-size:18px;line-height:1.3;letter-spacing:-.25px;overflow-wrap:anywhere}.meeting p{font-size:13px;margin:5px 0;color:var(--muted);overflow-wrap:anywhere}.meeting .meeting-time{font-size:15px;font-weight:650;color:var(--text)}
.meeting .badges{display:flex;gap:5px;flex-wrap:wrap;margin:12px 0}.meeting a{font-size:13px;font-weight:650;overflow-wrap:anywhere}.meeting details{font-size:12px;color:var(--muted);margin-top:9px}
/** \brief Groups the meeting's location and connection details, preserving supplied line breaks and long links. */
.meeting-location{display:inline-block;margin:5px 0;padding:5px 0}.meeting-location span{display:block}
.meeting-connection{margin:14px 0;padding:12px 14px;background:var(--inset);border-radius:10px}.meeting-connection .join-link{display:inline-block;padding:5px 0}.meeting-connection p{color:var(--text)}.connection-info,.connection-phone{white-space:pre-wrap}
.meeting .recovrr-button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;max-width:100%;margin-top:17px;padding:10px 17px;border:1px solid #21004425;border-radius:11px;background:linear-gradient(#ffffff40,#ffffff40),var(--brand);color:#210044;font-size:14px;font-weight:750;text-decoration:none}
.recovrr-button:hover{filter:brightness(1.08)}
.place-button{display:block;text-align:left;width:100%;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--text);padding:14px;margin:9px 0;font-size:14px}
footer{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;border-top:1px solid var(--line);margin:50px 0 0;padding:24px 0 32px;color:var(--muted);font-size:11px}
@media(max-width:760px){.workspace{grid-template-columns:1fr;gap:28px}.topbar-inner{padding:14px 20px;gap:12px;min-height:76px;grid-template-columns:minmax(44px,1fr) minmax(0,240px) minmax(136px,1fr)}.logo{width:44px;height:44px}main{padding:0 20px}.intro{padding:32px 0 26px}h1{font-size:38px}.intro>p:last-child{font-size:14px}.search-panel{padding:20px}.welcome{padding:30px 20px}.meeting{padding:17px;gap:11px;grid-template-columns:36px minmax(0,1fr)}.meeting::before{font-size:13px}.meeting h3{font-size:17px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important}}
@media(prefers-contrast:more){:root{--line:#777;--muted:#444}:root[data-theme="dark"]{--line:#aaa;--muted:#ddd}}
@media(prefers-contrast:more) and (prefers-color-scheme:dark){:root:not([data-theme="light"]){--line:#aaa;--muted:#ddd}}

@media(max-width:420px){.topbar-inner{padding-inline:16px;gap:8px}.logo{width:44px;height:44px}}

/* MARK: - Automatic Search and Dashboard Navigation - */
.search-navigation{display:flex;gap:8px;flex-wrap:wrap;padding:22px 0}
.search-navigation a{display:block;padding:10px 16px;border-radius:10px;text-decoration:none;font-size:14px;font-weight:650}
.search-navigation a:hover,.search-navigation a[aria-current="page"]{background:var(--tag);color:var(--purple)}
[data-view="automatic"] .intro,[data-view="automatic"] .search-panel,[data-view="automatic"] #welcome{display:none}
[data-view="automatic"] .workspace{display:block;max-width:850px;margin:18px auto 0}
[data-view="automatic"] .search-feedback{max-width:850px;margin:auto}
.search-feedback #status.error{border-left:3px solid var(--error);padding:12px 15px;background:var(--surface);border-radius:4px}
.search-feedback .cancel{margin:0 0 12px}
[data-view="dashboard"] .intro{padding-top:16px}
.badge.in-progress{background:var(--tag);color:var(--purple)}

@media(max-width:360px){.two-columns{grid-template-columns:1fr}.topbar-inner{padding-inline:12px;grid-template-columns:minmax(44px,1fr) minmax(0,240px) minmax(132px,1fr)}.theme-controls{gap:0}}

/** \brief Allows translated labels to wrap without widening narrow search panels. */
.mode-picker span,.weekdays span,.field-heading{overflow-wrap:anywhere}.weekdays span{font-size:10px}.text-button{max-width:60%;text-align:end}
@media(max-width:420px){.pagination{grid-template-columns:1fr 1fr}.pagination span{grid-column:1 / -1;grid-row:1}.pagination button{justify-self:start;max-width:100%;overflow-wrap:anywhere}.pagination button:last-child{justify-self:end}}