2d6eaccd96
Collapsing hid the sidebar entirely, and the toggle had moved into .menu-head while the hide rule still targeted direct children of .sidebar-nav — so the head went, taking the toggle with it, and there was no way to reopen the menu. Collapsed is now a 52px icon rail rather than a disappearance: the mark, the toggle, search and the account avatar stay reachable in place, so nothing has to be floated over the content and there is always a way back. The assistant rail collapses to the same strip. Scrolling. The workspace list in the assistant rail had no overflow rule, so its list of every app tab ran off the bottom and scrolling only appeared once you left for the app. In the app sidebar the opposite: the whole sidebar scrolled, so the account card scrolled away with the list and Settings and Log out became something to hunt for. Both now scroll only the list, with the head and the account card pinned. The toggle was also being styled twice — as a head-row icon button and by its own older rule with a different size and margin. It is now only the behavioural hook that flips the icon. Brand is PedAI, which is short enough to sit in the head row without squeezing the controls; the collapsed rail shows the mark alone. The reachability test now walks the toggle's real ancestor chain and fails if any collapse rule hides a branch it sits on, rather than asserting one rule's text — this class of bug has broken twice by moving the toggle deeper. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01GmpYHPSLGmXGZMyLpn2Lbe
1351 lines
98 KiB
CSS
1351 lines
98 KiB
CSS
html:not([data-feature-read_aloud="true"]) [data-action="speak"],
|
|
html:not([data-feature-read_aloud="true"]) [data-feature="read_aloud"],
|
|
html:not([data-feature-nextcloud="true"]) [data-action="nc-export"],
|
|
html:not([data-feature-nextcloud="true"]) [data-feature="nextcloud"],
|
|
html:not([data-feature-memories="true"]) [data-feature="memories"] { display: none !important; }
|
|
|
|
:root {
|
|
--blue: #2563eb; --blue-dark: #1d4ed8; --blue-light: #dbeafe;
|
|
--purple: #7c3aed; --purple-light: #ede9fe;
|
|
--teal: #0891b2; --teal-light: #cffafe;
|
|
--green: #10b981; --green-light: #d1fae5;
|
|
--red: #ef4444; --red-light: #fee2e2;
|
|
--amber: #f59e0b; --amber-light: #fef3c7;
|
|
--g50:#f9fafb;--g100:#f3f4f6;--g200:#e5e7eb;--g300:#d1d5db;--g400:#9ca3af;
|
|
--g500:#6b7280;--g600:#4b5563;--g700:#374151;--g800:#1f2937;--g900:#111827;
|
|
--radius:12px; --shadow:0 1px 3px rgba(0,0,0,0.08); --shadow-md:0 4px 12px rgba(0,0,0,0.08);
|
|
}
|
|
*{margin:0;padding:0;box-sizing:border-box;}
|
|
body{font-family:'Inter',system-ui,sans-serif;background:var(--g50);color:var(--g800);line-height:1.6;}
|
|
|
|
/* AUTH */
|
|
.auth-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;background:var(--g50);padding:20px;}
|
|
.auth-box{background:white;border-radius:20px;padding:40px;max-width:440px;width:100%;box-shadow:0 4px 6px -1px rgba(0,0,0,.07),0 20px 60px -10px rgba(37,99,235,.12);border:1px solid #e0e7ff;}
|
|
.auth-logo{text-align:center;margin-bottom:30px;}
|
|
.auth-logo i{font-size:40px;color:var(--blue);margin-bottom:10px;}
|
|
.auth-logo h1{font-size:24px;color:var(--g900);}
|
|
.auth-logo p{color:var(--g500);font-size:14px;}
|
|
.auth-form h2{font-size:20px;margin-bottom:20px;color:var(--g800);}
|
|
.form-group{margin-bottom:16px;}
|
|
.form-group label{display:block;font-size:13px;font-weight:600;color:var(--g600);margin-bottom:4px;}
|
|
.form-group input{width:100%;padding:10px 14px;border:1.5px solid var(--g300);border-radius:8px;font-size:14px;font-family:inherit;}
|
|
.form-group input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-light);}
|
|
.pw-breach-warning{margin-top:6px;padding:8px 10px;background:#fffbeb;border:1px solid #fcd34d;border-radius:6px;font-size:12px;color:#92400e;line-height:1.4;}
|
|
.pw-breach-warning i{margin-right:4px;color:#f59e0b;}
|
|
.form-group small{color:var(--g500);font-size:12px;}
|
|
.btn-auth{width:100%;padding:12px;background:var(--blue);color:white;border:none;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer;font-family:inherit;transition:background 0.2s;}
|
|
.btn-auth:hover{background:var(--blue-dark);}
|
|
.auth-links{text-align:center;margin-top:16px;font-size:13px;}
|
|
.auth-links a{color:var(--blue);text-decoration:none;margin:0 8px;}
|
|
.hipaa-notice{margin-top:24px;padding:12px;background:var(--amber-light);border-radius:8px;font-size:12px;color:#92400e;display:flex;align-items:flex-start;gap:8px;}
|
|
.hipaa-notice i{margin-top:2px;flex-shrink:0;}
|
|
|
|
/* FOOTER */
|
|
.app-footer{color:rgba(255,255,255,0.4);font-size:10.5px;text-align:center;padding:20px 24px 8px;line-height:1.6;}
|
|
|
|
|
|
/* HEADER */
|
|
/* No header bar at all. The brand heads the menu, Settings and Log out sit in
|
|
the account card at its foot, and the content gets the full height. */
|
|
/* Icon, search, collapse — nothing else earns a place in the head row. */
|
|
.menu-head { display:flex; align-items:center; gap:4px; padding:10px 8px 8px 12px; }
|
|
.menu-head .menu-icon-btn:first-of-type { margin-left:auto; }
|
|
.menu-brand { display:flex; align-items:center; gap:8px; flex:0 0 auto; min-width:0; }
|
|
.menu-brand h1 { font-size:15px; font-weight:700; color:var(--g900); margin:0; line-height:1; letter-spacing:-.01em; }
|
|
.menu-brand i { font-size:16px; color:var(--blue); flex:0 0 auto; }
|
|
.menu-brand i { transition:font-size .15s ease; }
|
|
.menu-icon-btn { flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; border:none; border-radius:8px; background:none; color:var(--g500); font-size:13px; cursor:pointer; }
|
|
.menu-icon-btn:hover { background:var(--g100); color:var(--g800); }
|
|
.assistant-history .menu-head { padding:0 0 8px; }
|
|
.btn-menu-toggle { display:none; }
|
|
@media(max-width:768px){
|
|
.btn-menu-toggle { display:inline-flex; align-items:center; justify-content:center; position:fixed; top:10px; left:10px; z-index:150; width:38px; height:38px; border:1px solid var(--g200); border-radius:10px; background:white; color:var(--g700); font-size:15px; box-shadow:var(--shadow); }
|
|
}
|
|
|
|
/* APP BODY LAYOUT */
|
|
.app-body{display:flex;min-height:100vh;}
|
|
|
|
/* SIDEBAR */
|
|
.sidebar{width:210px;flex-shrink:0;background:white;border-right:1.5px solid var(--g200);display:flex;flex-direction:column;position:sticky;top:0;height:100vh;overflow:hidden;z-index:100;transition:width 0.22s ease;}
|
|
.sidebar.collapsed{width:0;border:none;overflow:hidden;}
|
|
.sidebar-header{display:none;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid var(--g200);}
|
|
.sidebar-title{font-size:13px;font-weight:700;color:var(--g700);}
|
|
/* Head pinned, list scrolls, account card pinned. */
|
|
.sidebar-nav{display:flex;flex-direction:column;padding:0 0 8px;flex:1 1 auto;min-height:0;overflow:hidden;}
|
|
.sidebar-tabs{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:4px 0;}
|
|
.sidebar-section-label{font-size:10px;font-weight:700;color:var(--g400);text-transform:uppercase;letter-spacing:0.7px;padding:10px 16px 4px;}
|
|
.tab-btn{display:flex;align-items:center;gap:10px;padding:10px 16px;border:none;border-left:3px solid transparent;background:none;color:var(--g600);font-size:13px;font-weight:500;cursor:pointer;white-space:nowrap;font-family:inherit;transition:all 0.15s;width:100%;text-align:left;}
|
|
.tab-btn:hover{background:var(--g50);color:var(--g900);}
|
|
.tab-btn.active{background:var(--blue-light);color:var(--blue);border-left-color:var(--blue);font-weight:600;}
|
|
.tab-btn i{width:16px;text-align:center;flex-shrink:0;font-size:14px;}
|
|
.tab-btn span{overflow:hidden;text-overflow:ellipsis;}
|
|
.sidebar-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.45);z-index:199;}
|
|
.btn-menu-toggle{display:none;}
|
|
/* Sidebar collapse/expand buttons (desktop only) */
|
|
|
|
/* MAIN */
|
|
/* One shell for every view. Each tab used to be a plain white page while the
|
|
assistant and the workspace launcher sat on a tiled card, so opening any menu
|
|
item changed the whole face of the app. The tiled ground and the card edge
|
|
belong to the shell, so only the contents differ. */
|
|
.main-content{flex:1;min-width:0;min-height:0;padding:14px;display:flex;flex-direction:column;
|
|
background-image:linear-gradient(var(--g100) 1px, transparent 1px), linear-gradient(90deg, var(--g100) 1px, transparent 1px);
|
|
background-size:28px 28px;background-position:-1px -1px;background-color:var(--g50);}
|
|
.main-content > .tab-content.active{flex:1 1 auto;min-height:0;background:white;border:1px solid var(--g200);border-radius:14px;box-shadow:var(--shadow);padding:20px;overflow:auto;}
|
|
/* The assistant brings its own full-bleed layout, so it takes the shell's place
|
|
rather than nesting a second card inside it. */
|
|
.main-content > #assistant-tab.active{padding:0;border:none;box-shadow:none;background:transparent;overflow:visible;}
|
|
@media(max-width:768px){
|
|
.main-content{padding:8px;}
|
|
.main-content > .tab-content.active{padding:12px;border-radius:12px;}
|
|
.main-content > #assistant-tab.active{padding:0;}
|
|
}
|
|
.tab-content{display:none;}
|
|
.tab-content.active{display:block;animation:fadeIn 0.25s ease;}
|
|
@keyframes fadeIn{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:translateY(0);}}
|
|
|
|
.module-header{margin-bottom:16px;}
|
|
.module-header h2{font-size:18px;font-weight:700;display:flex;align-items:center;gap:8px;}
|
|
.module-header p{color:var(--g500);font-size:13px;margin-top:2px;}
|
|
|
|
/* DEMOGRAPHICS */
|
|
.demographics-bar{display:flex;gap:12px;flex-wrap:wrap;background:white;padding:12px 16px;border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:12px;}
|
|
.demo-field{display:flex;flex-direction:column;gap:3px;}
|
|
.demo-field label{font-size:10px;font-weight:600;color:var(--g500);text-transform:uppercase;letter-spacing:0.5px;}
|
|
.demo-field input,.demo-field select{padding:7px 10px;border:1.5px solid var(--g300);border-radius:8px;font-size:13px;font-family:inherit;min-width:130px;}
|
|
.demo-field input:focus,.demo-field select:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-light);}
|
|
.soap-options{display:flex;align-items:center;gap:10px;margin-bottom:12px;font-size:13px;font-weight:500;color:var(--g600);}
|
|
.soap-options select{padding:6px 10px;border:1.5px solid var(--g300);border-radius:8px;font-size:13px;font-family:inherit;}
|
|
|
|
/* CARDS */
|
|
.card{background:white;border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:12px;overflow:hidden;}
|
|
.card-header{display:flex;justify-content:space-between;align-items:center;padding:10px 16px;background:var(--g50);border-bottom:1px solid var(--g200);}
|
|
.card-header h3{font-size:13px;font-weight:600;color:var(--g700);display:flex;align-items:center;gap:6px;}
|
|
|
|
/* EDITABLE BOX */
|
|
.editable-box{min-height:240px;max-height:600px;overflow-y:auto;padding:14px 18px;font-size:13px;line-height:1.8;outline:none;border-radius:0 0 var(--radius) var(--radius);}
|
|
.editable-box:empty::before{content:attr(data-placeholder);color:var(--g400);}
|
|
|
|
/* NOTE ENTRY (hospital course, chart review) */
|
|
.note-entry{padding:10px 16px;}
|
|
.note-meta{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px;}
|
|
.note-meta input,.note-meta select{padding:6px 10px;border:1.5px solid var(--g300);border-radius:6px;font-size:13px;font-family:inherit;}
|
|
.note-dictate{padding-top:6px;}
|
|
.lab-entry{display:flex;gap:8px;padding:6px 16px;align-items:center;flex-wrap:wrap;}
|
|
.lab-entry input{padding:6px 10px;border:1.5px solid var(--g300);border-radius:6px;font-size:13px;font-family:inherit;flex:1;min-width:120px;}
|
|
.full-input{width:100%;padding:10px 16px;border:none;font-size:13px;font-family:inherit;outline:none;border-top:1px solid var(--g200);}
|
|
.action-row{margin-bottom:12px;}
|
|
|
|
/* RECORDING */
|
|
.record-controls{display:flex;align-items:center;gap:14px;padding:14px 16px;}
|
|
.record-btn{display:flex;align-items:center;gap:8px;padding:10px 22px;background:var(--red);color:white;border:none;border-radius:50px;font-size:14px;font-weight:600;cursor:pointer;font-family:inherit;transition:all 0.2s;box-shadow:0 3px 10px rgba(239,68,68,0.3);}
|
|
.record-btn:hover{transform:translateY(-1px);}
|
|
.record-btn.recording{background:var(--g700);box-shadow:0 3px 10px rgba(0,0,0,0.2);}
|
|
.btn-purple{background:var(--purple);box-shadow:0 3px 10px rgba(124,58,237,0.3);}
|
|
.btn-teal{background:var(--teal);box-shadow:0 3px 10px rgba(8,145,178,0.3);}
|
|
.btn-recording{background:var(--red) !important;color:white !important;animation:btnpulse 1.5s infinite;}
|
|
.recording-indicator{display:flex;align-items:center;gap:6px;color:var(--red);font-weight:500;font-size:13px;}
|
|
.recording-indicator.hidden{display:none;}
|
|
.pulse-dot{width:10px;height:10px;background:var(--red);border-radius:50%;animation:pulse 1.5s infinite;}
|
|
.pulse-purple{background:var(--purple);}
|
|
.pulse-teal{background:var(--teal);}
|
|
@keyframes pulse{0%,100%{opacity:1;transform:scale(1);}50%{opacity:0.4;transform:scale(1.3);}}
|
|
@keyframes btnpulse{0%,100%{opacity:1;}50%{opacity:0.7;}}
|
|
|
|
/* BUTTONS */
|
|
.btn-generate{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:12px;background:var(--blue);color:white;border:none;border-radius:var(--radius);font-size:14px;font-weight:600;cursor:pointer;font-family:inherit;margin-bottom:12px;transition:all 0.2s;box-shadow:0 3px 10px rgba(37,99,235,0.25);}
|
|
.btn-generate:hover{transform:translateY(-1px);}
|
|
.btn-generate:disabled{background:var(--g300);cursor:not-allowed;transform:none;box-shadow:none;}
|
|
.btn-generate-purple{background:var(--purple);box-shadow:0 3px 10px rgba(124,58,237,0.25);}
|
|
.btn-generate-teal{background:var(--teal);box-shadow:0 3px 10px rgba(8,145,178,0.25);}
|
|
.btn-generate-blue{background:var(--blue);box-shadow:0 3px 10px rgba(37,99,235,0.25);}
|
|
.btn-generate-green{background:var(--green);box-shadow:0 3px 10px rgba(16,185,129,0.25);}
|
|
|
|
.btn-sm{display:inline-flex;align-items:center;gap:4px;padding:5px 10px;border:none;border-radius:6px;font-size:12px;font-weight:500;cursor:pointer;font-family:inherit;transition:all 0.15s;}
|
|
#btn-assistant-cancel[hidden]{display:none!important;}
|
|
.btn-lg{display:inline-flex;align-items:center;gap:6px;padding:9px 18px;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;font-family:inherit;transition:all 0.15s;}
|
|
.btn-primary{background:var(--blue);color:white;}.btn-primary:hover{background:var(--blue-dark);}
|
|
.btn-ghost{background:var(--g200);color:var(--g700);}.btn-ghost:hover{background:var(--g300);}
|
|
.btn-success{background:var(--green);color:white;}.btn-success:hover{background:#059669;}
|
|
.btn-warning{background:var(--amber);color:white;}.btn-warning:hover{background:#d97706;}
|
|
.btn-reading{background:var(--red)!important;color:white!important;animation:btnpulse 1.5s infinite;}
|
|
|
|
/* OUTPUT */
|
|
.output-card{border:2px solid var(--green);}
|
|
.output-card.hidden{display:none;}
|
|
.output-header{background:var(--green-light);border-bottom-color:var(--green);}
|
|
.output-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
|
|
.output-text{padding:20px 24px;font-size:13px;line-height:1.9;outline:none;min-height:480px;white-space:pre-wrap;overflow-y:auto;}
|
|
.output-text-large{min-height:600px;}
|
|
.editable-box-large{min-height:400px;}
|
|
.model-tag{font-size:10px;padding:2px 7px;background:var(--g200);border-radius:4px;color:var(--g600);}
|
|
|
|
/* REFINE BAR */
|
|
.refine-bar{display:flex;gap:6px;padding:10px 16px;border-top:1px solid var(--g200);background:var(--g50);align-items:flex-start;flex-wrap:wrap;}
|
|
.refine-input{flex:1;min-width:200px;padding:7px 12px;border:1.5px solid var(--g300);border-radius:6px;font-size:13px;font-family:inherit;resize:vertical;}
|
|
textarea.full-input{resize:vertical;}
|
|
.refine-input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-light);}
|
|
|
|
/* CLARIFY BOX */
|
|
.clarify-box{padding:14px 16px;background:var(--amber-light);border-top:1px solid #fbbf24;font-size:13px;line-height:1.8;white-space:pre-wrap;color:#92400e;}
|
|
.clarify-box.hidden{display:none;}
|
|
|
|
/* MILESTONES */
|
|
.legend{display:flex;gap:16px;flex-wrap:wrap;padding:8px 14px;background:var(--teal-light);border-radius:var(--radius);margin-bottom:12px;font-size:12px;}
|
|
.legend-item{display:flex;align-items:center;gap:5px;}
|
|
.legend-icon{width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;border-radius:6px;font-size:12px;font-weight:700;}
|
|
.legend-yes{background:var(--green-light);color:var(--green);border:2px solid var(--green);}
|
|
.legend-no{background:var(--red-light);color:var(--red);border:2px solid var(--red);}
|
|
.legend-blank{background:var(--g100);color:var(--g400);border:2px solid var(--g300);}
|
|
|
|
.domain-section{background:white;border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:10px;overflow:hidden;}
|
|
.domain-header{padding:10px 16px;font-weight:700;font-size:13px;display:flex;align-items:center;gap:6px;}
|
|
.domain-header .badge{margin-left:auto;font-size:10px;font-weight:500;padding:2px 8px;border-radius:8px;background:rgba(255,255,255,0.6);}
|
|
.domain-gross-motor .domain-header{background:var(--amber-light);color:#92400e;}
|
|
.domain-fine-motor .domain-header{background:var(--blue-light);color:#1e40af;}
|
|
.domain-language .domain-header{background:var(--purple-light);color:#5b21b6;}
|
|
.domain-social .domain-header{background:#fce7f3;color:#9d174d;}
|
|
.domain-cognitive .domain-header{background:var(--green-light);color:#065f46;}
|
|
|
|
.ms-items{padding:4px 6px;}
|
|
.ms-item{display:flex;align-items:center;gap:8px;padding:6px 10px;border-radius:6px;transition:background 0.15s;}
|
|
.ms-item:hover{background:var(--g50);}
|
|
.ms-toggle{display:flex;gap:3px;flex-shrink:0;}
|
|
.toggle-btn{width:30px;height:30px;display:flex;align-items:center;justify-content:center;border:2px solid var(--g300);border-radius:6px;background:white;cursor:pointer;font-size:14px;font-weight:700;color:var(--g400);transition:all 0.15s;}
|
|
.toggle-btn:hover{border-color:var(--g400);}
|
|
.toggle-btn.yes-on{background:var(--green-light);border-color:var(--green);color:var(--green);}
|
|
.toggle-btn.no-on{background:var(--red-light);border-color:var(--red);color:var(--red);}
|
|
.ms-text{font-size:13px;color:var(--g700);}
|
|
.ms-item.is-yes .ms-text{color:var(--g900);font-weight:500;}
|
|
.ms-item.is-no .ms-text{color:var(--red);}
|
|
.milestone-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:12px 0;}
|
|
|
|
.summary-bar{display:flex;gap:14px;padding:8px 16px;background:var(--g50);border-bottom:1px solid var(--g200);font-size:12px;}
|
|
.summary-bar.hidden{display:none;}
|
|
.stat{display:flex;align-items:center;gap:5px;font-weight:500;}
|
|
.dot{width:8px;height:8px;border-radius:50%;}.dot-green{background:var(--green);}.dot-red{background:var(--red);}.dot-gray{background:var(--g400);}
|
|
|
|
.summary-section{border-top:2px dashed var(--g200);}
|
|
.summary-section-header{padding:12px 16px;}
|
|
.btn-generate-summary{display:inline-flex;align-items:center;gap:6px;padding:8px 18px;background:linear-gradient(135deg,#f59e0b,#d97706);color:white;border:none;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit;transition:all 0.2s;}
|
|
.btn-generate-summary:hover{transform:translateY(-1px);}
|
|
.btn-generate-summary:disabled{background:var(--g300);cursor:not-allowed;transform:none;}
|
|
.summary-output-header{background:var(--amber-light);border-bottom:1px solid #fbbf24;border-top:1px solid var(--g200);}
|
|
.summary-output-text{padding:14px 16px;font-size:13px;line-height:1.8;outline:none;background:#fffbeb;font-weight:500;white-space:pre-wrap;}
|
|
|
|
/* MODAL */
|
|
.modal{position:fixed;inset:0;background:rgba(0,0,0,0.5);display:flex;align-items:center;justify-content:center;z-index:5000;padding:20px;backdrop-filter:blur(3px);}
|
|
.modal.hidden{display:none;}
|
|
.modal-content{background:white;border-radius:16px;max-width:600px;width:100%;max-height:90vh;overflow-y:auto;box-shadow:0 20px 40px rgba(0,0,0,0.2);}
|
|
.modal-header{display:flex;justify-content:space-between;align-items:center;padding:16px 24px;border-bottom:1px solid var(--g200);}
|
|
.modal-header h2{font-size:18px;display:flex;align-items:center;gap:8px;}
|
|
.modal-close{background:none;border:none;font-size:18px;color:var(--g500);cursor:pointer;padding:4px;}
|
|
.modal-body{padding:24px;}
|
|
.settings-section{margin-bottom:28px;}
|
|
.settings-section h3{font-size:15px;font-weight:600;margin-bottom:10px;display:flex;align-items:center;gap:8px;color:var(--g800);}
|
|
.settings-section p{font-size:13px;color:var(--g600);margin-bottom:8px;}
|
|
.settings-section .form-group{margin-bottom:12px;}
|
|
.settings-section img{max-width:200px;margin:12px 0;border:1px solid var(--g200);border-radius:8px;}
|
|
.settings-section code{background:var(--g100);padding:2px 8px;border-radius:4px;font-size:12px;}
|
|
.hipaa-info{font-size:13px;color:var(--g700);}
|
|
.hipaa-info ul{margin:8px 0 8px 20px;}
|
|
.hipaa-info li{margin-bottom:4px;}
|
|
|
|
/* LOADING */
|
|
.loading-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.4);display:flex;align-items:center;justify-content:center;z-index:9999;backdrop-filter:blur(3px);}
|
|
.loading-overlay.hidden{display:none;}
|
|
.loading-box{background:white;padding:28px 44px;border-radius:var(--radius);text-align:center;box-shadow:var(--shadow-md);}
|
|
.spinner{width:32px;height:32px;border:4px solid var(--g200);border-top-color:var(--blue);border-radius:50%;animation:spin 0.7s linear infinite;margin:0 auto 12px;}
|
|
@keyframes spin{to{transform:rotate(360deg);}}
|
|
.loading-box p{color:var(--g600);font-weight:500;font-size:13px;}
|
|
.confirm-modal{position:fixed;inset:0;background:rgba(0,0,0,0.35);display:flex;align-items:center;justify-content:center;z-index:10000;backdrop-filter:blur(2px);}
|
|
.confirm-modal.hidden{display:none;}
|
|
.confirm-modal-box{background:white;padding:24px;border-radius:12px;box-shadow:0 8px 30px rgba(0,0,0,0.15);max-width:420px;width:90%;animation:modalIn 0.15s ease;}
|
|
.confirm-modal-box p{margin:0;font-size:14px;line-height:1.6;color:var(--g800);}
|
|
@keyframes modalIn{from{opacity:0;transform:scale(0.95)} to{opacity:1;transform:scale(1)}}
|
|
|
|
/* FAQ */
|
|
.faq-container{max-width:800px;margin:0 auto;}
|
|
.faq-section{margin-bottom:24px;}
|
|
.faq-section-title{font-size:16px;font-weight:700;color:var(--g800);margin:0 0 12px;padding:10px 0;border-bottom:2px solid var(--g200);display:flex;align-items:center;gap:8px;}
|
|
.faq-section-title i{color:var(--blue);font-size:14px;}
|
|
.faq-item{border:1px solid var(--g200);border-radius:8px;margin-bottom:6px;overflow:hidden;transition:box-shadow 0.15s;}
|
|
.faq-item:hover{box-shadow:0 1px 4px rgba(0,0,0,0.06);}
|
|
.faq-question{display:flex;align-items:center;width:100%;padding:14px 16px;background:white;border:none;cursor:pointer;font-size:14px;font-weight:600;color:var(--g800);text-align:left;font-family:inherit;gap:10px;transition:background 0.15s;}
|
|
.faq-question:hover{background:var(--g50);}
|
|
.faq-question::before{content:'\f054';font-family:'Font Awesome 6 Free';font-weight:900;font-size:10px;color:var(--g400);transition:transform 0.2s;flex-shrink:0;}
|
|
.faq-item.open .faq-question::before{transform:rotate(90deg);color:var(--blue);}
|
|
.faq-item.open .faq-question{background:var(--g50);color:var(--blue-dark);}
|
|
.faq-answer{max-height:0;overflow:hidden;transition:max-height 0.3s ease,padding 0.3s ease;padding:0 16px;}
|
|
.faq-item.open .faq-answer{max-height:800px;padding:12px 16px 16px;}
|
|
.faq-answer p{margin:0 0 10px;font-size:13.5px;line-height:1.7;color:var(--g700);}
|
|
.faq-answer p:last-child{margin-bottom:0;}
|
|
.faq-answer ul,.faq-answer ol{margin:0 0 10px;padding-left:20px;font-size:13.5px;line-height:1.7;color:var(--g700);}
|
|
.faq-answer li{margin-bottom:4px;}
|
|
.faq-answer strong{color:var(--g800);}
|
|
.faq-answer em{color:var(--g500);font-size:12.5px;}
|
|
|
|
/* Billing codes */
|
|
.billing-codes-card{margin-top:12px;padding:14px;background:var(--g50);border-radius:8px;border:1px solid var(--g200);}
|
|
.billing-codes-card.hidden{display:none;}
|
|
.billing-codes-card h4{font-size:13px;font-weight:700;color:var(--g700);margin:0 0 8px;display:flex;align-items:center;gap:6px;}
|
|
.billing-codes-section{margin-bottom:10px;}
|
|
.billing-codes-section:last-child{margin-bottom:0;}
|
|
.billing-codes-label{font-size:11px;font-weight:600;color:var(--g500);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:4px;}
|
|
.billing-code-chip{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;border-radius:6px;font-size:12px;font-weight:600;cursor:pointer;margin:3px;transition:opacity 0.15s;}
|
|
.billing-code-chip.icd{background:#dbeafe;color:#1d4ed8;border:1px solid #93c5fd;}
|
|
.billing-code-chip.cpt{background:#d1fae5;color:#059669;border:1px solid #6ee7b7;}
|
|
.billing-code-chip.em{background:#ede9fe;color:#7c3aed;border:1px solid #c4b5fd;}
|
|
.billing-code-chip:hover{opacity:0.7;}
|
|
.billing-code-chip:active{transform:scale(0.95);}
|
|
.billing-code-name{font-weight:400;color:var(--g600);font-size:11px;margin-left:2px;}
|
|
|
|
/* Calculators */
|
|
.calc-pill,.calc-nav-pill{padding:8px 16px;border-radius:20px;border:1.5px solid var(--g200);background:white;font-size:13px;font-weight:600;color:var(--g600);cursor:pointer;transition:all 0.15s;}
|
|
.calc-pill:hover,.calc-nav-pill:hover{border-color:var(--blue);color:var(--blue);}
|
|
.calc-pill.active,.calc-nav-pill.active{background:var(--blue);color:white;border-color:var(--blue);}
|
|
.calc-panel.hidden{display:none;}
|
|
.calc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,180px),1fr));gap:12px;}
|
|
.calc-field label{display:block;font-size:12px;font-weight:600;color:var(--g600);margin-bottom:3px;}
|
|
.calc-field input,.calc-field select{width:100%;padding:8px 10px;border:1.5px solid var(--g300);border-radius:6px;font-size:13px;font-family:inherit;}
|
|
.calc-field input:focus,.calc-field select:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-light);}
|
|
.calc-result{margin-top:16px;}
|
|
.calc-result-header{padding:16px;border-radius:10px;border-left:4px solid;text-align:center;}
|
|
.calc-result-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin-top:12px;}
|
|
.calc-result-item{padding:12px;background:var(--g50);border-radius:8px;text-align:center;}
|
|
.calc-result-label{font-size:11px;font-weight:600;color:var(--g500);text-transform:uppercase;letter-spacing:0.5px;}
|
|
.calc-result-value{font-size:24px;font-weight:700;color:var(--g800);margin:4px 0;}
|
|
.calc-result-sub{font-size:11px;color:var(--g500);}
|
|
.chart-container{margin-top:16px;padding:12px;background:white;border:1px solid var(--g200);border-radius:10px;max-width:750px;}
|
|
.chart-container.hidden{display:none;}
|
|
|
|
/* Non-blocking inline busy bar */
|
|
.busy-bar{position:sticky;top:0;z-index:100;display:none;align-items:center;gap:8px;padding:8px 16px;background:linear-gradient(135deg,#eff6ff,#e0f2fe);border-bottom:1px solid #bfdbfe;font-size:13px;font-weight:500;color:#1d4ed8;animation:busySlideIn 0.2s ease;}
|
|
.busy-bar.active{display:flex;}
|
|
.busy-bar .busy-spinner{width:16px;height:16px;border:2.5px solid #bfdbfe;border-top-color:#2563eb;border-radius:50%;animation:spin 0.7s linear infinite;flex-shrink:0;}
|
|
.busy-bar .busy-text{flex:1;}
|
|
.busy-bar .busy-cancel{background:none;border:1px solid #93c5fd;border-radius:4px;padding:3px 10px;font-size:11px;color:#1d4ed8;cursor:pointer;font-weight:600;}
|
|
.busy-bar .busy-cancel:hover{background:#dbeafe;}
|
|
@keyframes busySlideIn{from{opacity:0;transform:translateY(-100%);} to{opacity:1;transform:translateY(0);}}
|
|
|
|
/* TOAST */
|
|
.toast-container{position:fixed;bottom:16px;right:16px;display:flex;flex-direction:column;gap:6px;z-index:10000;}
|
|
.toast{padding:8px 16px;border-radius:8px;color:white;font-size:12px;font-weight:500;box-shadow:var(--shadow-md);animation:slideIn 0.3s ease;display:flex;align-items:center;gap:6px;}
|
|
.toast-success{background:var(--green);}.toast-error{background:var(--red);}.toast-info{background:var(--blue);}
|
|
@keyframes slideIn{from{transform:translateX(100%);opacity:0;}to{transform:translateX(0);opacity:1;}}
|
|
|
|
.hidden{display:none;}
|
|
|
|
/* RESPONSIVE */
|
|
@media(max-width:768px){
|
|
.header-top{flex-direction:row;align-items:center;}
|
|
.header-right{flex-wrap:wrap;}
|
|
.model-selector{flex:1;}
|
|
.model-selector select{max-width:160px;flex:1;}
|
|
.btn-menu-toggle{display:flex;align-items:center;justify-content:center;}
|
|
/* Sidebar: hidden off-screen on mobile, slides in */
|
|
.app-body{display:block;}
|
|
.sidebar{position:fixed;left:-220px;top:0;width:220px;height:100vh;z-index:200;transition:left 0.28s ease;box-shadow:none;}
|
|
.sidebar.open{left:0;box-shadow:4px 0 20px rgba(0,0,0,0.18);}
|
|
.sidebar.open~.sidebar-overlay{display:block;}
|
|
.sidebar-header{display:flex;}
|
|
/* The sidebar slides in as a whole on mobile, so a collapse control inside it
|
|
has nothing to collapse — the overlay close is the way out. */
|
|
.assistant-menu-toggle{display:none !important;}
|
|
/* Give the drawer room to breathe and keep the account card reachable at the
|
|
foot of a scrolling menu. */
|
|
.sidebar{display:flex;flex-direction:column;overflow-y:auto;}
|
|
.sidebar-nav{flex:1 1 auto;min-height:0;}
|
|
.menu-head{padding:12px 10px 8px;}
|
|
.account-card{position:sticky;bottom:0;background:white;}
|
|
.account-menu{left:8px;right:8px;}
|
|
/* The palette is full-bleed on a phone, where a centred dialog wastes space. */
|
|
.menu-search{padding:0;align-items:stretch;}
|
|
.menu-search-panel{width:100%;max-height:100%;border:none;border-radius:0;}
|
|
.main-content{padding:8px;}
|
|
.demographics-bar{flex-direction:column;}
|
|
.demo-field input,.demo-field select{min-width:100%;}
|
|
.note-meta{flex-direction:column;}
|
|
.note-meta input,.note-meta select{min-width:100%;}
|
|
.refine-bar{flex-direction:column;}
|
|
.refine-input{min-width:100%;}
|
|
.milestone-actions{flex-direction:column;}
|
|
.auth-box{padding:24px;}
|
|
}
|
|
|
|
/* TOGGLE SWITCH */
|
|
.toggle-switch{position:relative;display:inline-block;width:36px;height:20px;vertical-align:middle;}
|
|
.toggle-switch input{opacity:0;width:0;height:0;}
|
|
.toggle-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background:var(--g300);border-radius:20px;transition:.2s;}
|
|
.toggle-slider::before{content:'';position:absolute;height:16px;width:16px;left:2px;bottom:2px;background:white;border-radius:50%;transition:.2s;}
|
|
.toggle-switch input:checked+.toggle-slider{background:var(--blue);}
|
|
.toggle-switch input:checked+.toggle-slider::before{transform:translateX(16px);}
|
|
|
|
.editable-box::-webkit-scrollbar,.output-text::-webkit-scrollbar{width:5px;}
|
|
.editable-box::-webkit-scrollbar-thumb,.output-text::-webkit-scrollbar-thumb{background:var(--g300);border-radius:3px;}
|
|
|
|
/* Per-tab model selector */
|
|
.demo-field-model { flex: 1; min-width: 180px; }
|
|
.demo-field-model select { min-width: 180px; max-width: 260px; }
|
|
|
|
/* Labs textarea */
|
|
.visit-labs, .lab-values {
|
|
width: 100%; padding: 8px 12px; border: 1.5px solid var(--g300);
|
|
border-radius: 8px; font-size: 13px; font-family: inherit;
|
|
resize: vertical; margin-top: 8px; line-height: 1.5;
|
|
}
|
|
.visit-labs:focus, .lab-values:focus {
|
|
outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px var(--blue-light);
|
|
}
|
|
|
|
/* Admin Panel */
|
|
.admin-stats{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:12px;}
|
|
.stat-card{flex:1;min-width:120px;background:white;border-radius:var(--radius);box-shadow:var(--shadow);padding:16px;text-align:center;}
|
|
.stat-value{font-size:28px;font-weight:700;color:var(--blue);}
|
|
.stat-label{font-size:12px;color:var(--g500);margin-top:4px;}
|
|
.admin-table{width:100%;border-collapse:collapse;font-size:13px;}
|
|
.admin-table th{text-align:left;padding:10px 16px;background:var(--g50);border-bottom:2px solid var(--g200);font-weight:600;color:var(--g600);font-size:12px;text-transform:uppercase;letter-spacing:0.4px;}
|
|
.admin-table td{padding:10px 16px;border-bottom:1px solid var(--g100);vertical-align:middle;}
|
|
.admin-table tr:last-child td{border-bottom:none;}
|
|
.admin-table tr:hover td{background:var(--g50);}
|
|
|
|
/* ── WELL VISIT TAB ────────────────────────────────────────────────────────── */
|
|
.wv-subtab-bar{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap;}
|
|
.wv-subtab-btn{padding:8px 18px;border:1.5px solid var(--g300);border-radius:8px;background:white;color:var(--g600);font-size:13px;font-weight:500;cursor:pointer;font-family:inherit;display:flex;align-items:center;gap:6px;transition:all 0.15s;}
|
|
.wv-subtab-btn:hover{border-color:var(--blue);color:var(--blue);}
|
|
.wv-subtab-btn.active{background:var(--blue);border-color:var(--blue);color:white;}
|
|
|
|
.wv-subpanel{animation:fadeIn 0.2s;}
|
|
.wv-visit-selector-row{display:flex;align-items:center;gap:12px;margin-bottom:20px;flex-wrap:wrap;}
|
|
.wv-visit-selector-row label{font-weight:600;font-size:14px;color:var(--g700);display:flex;align-items:center;gap:6px;}
|
|
.wv-visit-select{padding:8px 14px;border:1.5px solid var(--g300);border-radius:8px;font-size:14px;font-family:inherit;color:var(--g800);background:white;cursor:pointer;min-width:200px;}
|
|
.wv-visit-select:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-light);}
|
|
|
|
.wv-visit-detail{display:flex;flex-direction:column;gap:14px;min-height:400px;}
|
|
.wv-section{background:white;border-radius:var(--radius);box-shadow:var(--shadow);padding:16px 20px;}
|
|
.wv-section-title{font-size:14px;font-weight:700;color:var(--g700);margin-bottom:12px;display:flex;align-items:center;gap:8px;}
|
|
.wv-section-title i{color:var(--blue);}
|
|
|
|
/* Lincoln quick reference */
|
|
.wv-lincoln-reference{padding:14px 16px;background:var(--g50);}
|
|
.wv-lincoln-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px;}
|
|
.wv-lincoln-card{border:1px solid var(--g100);border-radius:12px;padding:14px 16px;background:white;box-shadow:0 1px 2px rgba(15,23,42,0.04);}
|
|
.wv-lincoln-card h4{margin:0 0 10px;font-size:14px;color:var(--g800);}
|
|
.wv-lincoln-card ul{margin:0;padding-left:18px;color:var(--g700);font-size:13px;line-height:1.65;}
|
|
.wv-lincoln-card li{margin-bottom:6px;}
|
|
.wv-lincoln-card li:last-child{margin-bottom:0;}
|
|
@media(max-width:640px){
|
|
.wv-lincoln-reference{padding:10px;}
|
|
.wv-lincoln-grid{grid-template-columns:1fr;gap:10px;}
|
|
.wv-lincoln-card{padding:12px;}
|
|
.wv-lincoln-card ul{font-size:12.5px;line-height:1.55;}
|
|
}
|
|
|
|
/* Billing */
|
|
.wv-billing-grid{display:flex;flex-wrap:wrap;gap:12px;align-items:center;}
|
|
.wv-billing-cell{display:flex;align-items:center;gap:8px;}
|
|
.wv-label{font-size:12px;font-weight:600;color:var(--g500);text-transform:uppercase;letter-spacing:0.5px;}
|
|
.wv-code-chip{padding:4px 12px;border-radius:20px;font-size:13px;font-weight:700;font-family:monospace;}
|
|
.wv-code-chip.icd{background:var(--blue-light);color:var(--blue-dark);}
|
|
.wv-code-chip.cpt{background:var(--purple-light);color:var(--purple);}
|
|
.wv-billing-desc{width:100%;font-size:13px;color:var(--g600);margin-top:4px;}
|
|
|
|
/* Chips */
|
|
.wv-chip-list{display:flex;flex-wrap:wrap;gap:8px;}
|
|
.wv-chip{padding:4px 12px;border-radius:20px;font-size:12px;font-weight:600;}
|
|
.wv-chip-measure{background:var(--teal-light);color:var(--teal);}
|
|
.wv-chip-range{background:var(--amber-light);color:#92400e;}
|
|
|
|
/* Vaccines */
|
|
.wv-vax-list{display:flex;flex-direction:column;gap:10px;min-height:80px;}
|
|
.wv-vax-item{background:var(--g50);border-radius:8px;padding:12px 16px;border-left:3px solid var(--green);}
|
|
.wv-vax-name{font-size:14px;font-weight:600;color:var(--g800);display:flex;align-items:center;gap:8px;}
|
|
.wv-vax-dot{color:var(--green);font-size:10px;}
|
|
.wv-vax-dose{display:inline-block;margin-top:4px;font-size:11px;font-weight:700;padding:2px 10px;background:var(--green-light);color:#065f46;border-radius:10px;}
|
|
.wv-vax-note{margin-top:6px;font-size:12px;color:var(--g500);display:flex;align-items:flex-start;gap:6px;}
|
|
.wv-vax-note i{color:var(--blue);margin-top:2px;flex-shrink:0;}
|
|
/* Vaccine status row */
|
|
.wv-vax-status-row{display:flex;gap:4px;flex-wrap:wrap;margin-top:6px;}
|
|
|
|
/* Screens */
|
|
.wv-screen-list{display:flex;flex-direction:column;gap:10px;min-height:60px;}
|
|
.wv-screen-item{display:flex;align-items:center;gap:10px;}
|
|
.wv-status-badge{flex-shrink:0;font-size:11px;font-weight:700;padding:2px 10px;border-radius:10px;text-transform:uppercase;letter-spacing:0.4px;}
|
|
.wv-status-dot{background:var(--green-light);color:#065f46;}
|
|
.wv-status-risk{background:var(--amber-light);color:#92400e;}
|
|
.wv-status-range{background:var(--blue-light);color:var(--blue-dark);}
|
|
.wv-screen-name{font-size:13px;color:var(--g700);}
|
|
|
|
/* Growth & Feeding */
|
|
.wv-growth-box{display:flex;flex-direction:column;gap:8px;}
|
|
.wv-growth-item{display:flex;gap:8px;align-items:baseline;font-size:13px;line-height:1.5;padding:6px 10px;background:var(--g50);border-radius:8px;}
|
|
.wv-growth-label{font-weight:600;color:var(--g700);min-width:120px;white-space:nowrap;}
|
|
.wv-feeding-list{margin:0;padding-left:20px;font-size:13px;line-height:1.7;color:var(--g700);}
|
|
.wv-feeding-list li{margin-bottom:4px;}
|
|
/* BMI Classification */
|
|
.wv-bmi-table{display:flex;flex-direction:column;gap:6px;}
|
|
.wv-bmi-row{display:grid;grid-template-columns:160px 1fr 1fr;gap:8px;padding:8px 12px;background:var(--g50);border-radius:8px;font-size:12px;align-items:center;}
|
|
.wv-bmi-label{font-weight:700;font-size:13px;}
|
|
.wv-bmi-range{color:var(--g600);}
|
|
.wv-bmi-action{color:var(--g600);font-style:italic;}
|
|
.wv-bmi-note{margin-top:8px;font-size:11px;color:#6b7280;display:flex;align-items:flex-start;gap:6px;}
|
|
@media(max-width:768px){.wv-bmi-row{grid-template-columns:1fr;}}
|
|
|
|
/* Notes */
|
|
.wv-notes-box{background:var(--blue-light);border-radius:8px;padding:12px 16px;font-size:13px;color:#1e40af;display:flex;align-items:flex-start;gap:8px;}
|
|
.wv-empty,.wv-loading{color:var(--g400);font-size:14px;padding:20px 0;text-align:center;}
|
|
|
|
/* Catch-up */
|
|
.wv-catchup-intro{background:var(--blue-light);border-radius:8px;padding:12px 16px;font-size:13px;color:#1e40af;display:flex;align-items:flex-start;gap:8px;margin-bottom:16px;}
|
|
.wv-catchup-card{background:white;border-radius:var(--radius);box-shadow:var(--shadow);padding:16px 20px;margin-bottom:14px;}
|
|
.wv-catchup-title{font-size:14px;font-weight:700;color:var(--g800);margin-bottom:10px;display:flex;align-items:center;gap:8px;}
|
|
.wv-catchup-title i{color:var(--green);}
|
|
.wv-catchup-min-age{font-size:13px;color:var(--g600);margin-bottom:10px;}
|
|
.wv-catchup-table{width:100%;border-collapse:collapse;font-size:12px;margin-bottom:10px;}
|
|
.wv-catchup-table th{text-align:left;padding:6px 10px;background:var(--g50);border-bottom:2px solid var(--g200);font-weight:600;color:var(--g600);font-size:11px;text-transform:uppercase;letter-spacing:0.4px;}
|
|
.wv-catchup-table td{padding:6px 10px;border-bottom:1px solid var(--g100);vertical-align:top;}
|
|
.wv-catchup-table tr:last-child td{border-bottom:none;}
|
|
.wv-catchup-notes{margin:0;padding:0 0 0 18px;font-size:12px;color:var(--g600);line-height:1.7;}
|
|
|
|
/* Full schedule table */
|
|
.wv-schedule-scroll{overflow-x:auto;border-radius:var(--radius);box-shadow:var(--shadow);}
|
|
.wv-schedule-table{min-width:900px;width:100%;border-collapse:collapse;font-size:12px;background:white;}
|
|
.wv-schedule-table th{text-align:center;padding:8px 6px;background:var(--g50);border-bottom:2px solid var(--g200);font-weight:700;color:var(--g600);font-size:11px;position:sticky;top:0;z-index:1;}
|
|
.wv-sched-vax-col{text-align:left!important;min-width:200px;position:sticky;left:0;background:var(--g50)!important;z-index:2;}
|
|
.wv-sched-age-col{min-width:70px;}
|
|
.wv-sched-vax-name{padding:8px 10px;border-bottom:1px solid var(--g100);font-weight:600;color:var(--g700);position:sticky;left:0;background:white;z-index:1;}
|
|
.wv-sched-cell{padding:6px 4px;border-bottom:1px solid var(--g100);text-align:center;color:var(--g400);}
|
|
.wv-sched-has{background:var(--green-light);color:#065f46;font-weight:700;border-radius:4px;cursor:help;}
|
|
.wv-sched-legend{font-size:11px;color:var(--g400);margin-top:10px;display:flex;align-items:center;gap:6px;}
|
|
.wv-sched-leg-dot{display:inline-block;width:12px;height:12px;background:var(--green-light);border-radius:2px;}
|
|
|
|
/* Announcement Banner */
|
|
.announcement-banner{display:flex;align-items:center;gap:10px;padding:10px 16px;font-size:13px;font-weight:500;border-bottom:1px solid transparent;}
|
|
.announcement-banner.hidden{display:none;}
|
|
.announcement-banner.ann-info{background:#eff6ff;color:#1d4ed8;border-color:#bfdbfe;}
|
|
.announcement-banner.ann-warning{background:#fffbeb;color:#92400e;border-color:#fcd34d;}
|
|
.announcement-banner.ann-error{background:#fef2f2;color:#991b1b;border-color:#fca5a5;}
|
|
.announcement-banner.ann-success{background:#f0fdf4;color:#166534;border-color:#86efac;}
|
|
.announcement-banner span{flex:1;}
|
|
.announcement-close{background:none;border:none;cursor:pointer;opacity:0.6;font-size:15px;padding:6px 8px;color:inherit;line-height:1;border-radius:4px;}
|
|
.announcement-close:hover{opacity:1;background:rgba(0,0,0,0.08);}
|
|
|
|
/* Save bar (encounter label + save/load) */
|
|
.save-bar-wrap{position:relative;margin-bottom:10px;}
|
|
.save-bar{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--g50);border:1px solid var(--g200);border-radius:var(--radius);flex-wrap:wrap;}
|
|
.save-label-input{flex:1;min-width:160px;font-size:13px;padding:5px 8px;border:1px solid var(--g200);border-radius:6px;background:white;}
|
|
.save-label-input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 2px rgba(37,99,235,.12);}
|
|
|
|
/* Saved encounters list */
|
|
.saved-enc-item{display:flex;align-items:center;gap:8px;padding:8px 10px;background:var(--g50);border:1px solid var(--g200);border-radius:8px;font-size:13px;}
|
|
.saved-enc-label{flex:1;font-weight:600;color:var(--g800);}
|
|
.saved-enc-meta{font-size:11px;color:var(--g500);}
|
|
.saved-enc-type{font-size:11px;background:var(--blue-light);color:var(--blue);padding:1px 6px;border-radius:10px;font-weight:600;}
|
|
|
|
/* Memory list item */
|
|
.mem-item{display:flex;align-items:flex-start;gap:8px;padding:8px 10px;background:var(--g50);border:1px solid var(--g200);border-radius:8px;}
|
|
.mem-item-info{flex:1;}
|
|
.mem-item-name{font-weight:600;font-size:13px;color:var(--g800);}
|
|
.mem-item-cat{font-size:11px;background:var(--green-light);color:#166534;padding:1px 6px;border-radius:10px;font-weight:600;}
|
|
.mem-item-preview{font-size:12px;color:var(--g500);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:320px;}
|
|
|
|
/* Models list in admin CMS */
|
|
.model-row{display:flex;align-items:center;gap:10px;padding:6px 0;border-bottom:1px solid var(--g100);}
|
|
.model-row:last-child{border-bottom:none;}
|
|
.model-row-name{flex:1;font-size:13px;font-weight:500;color:var(--g800);}
|
|
.model-row-cost{font-size:12px;color:var(--g500);}
|
|
.model-row-tag{font-size:10px;background:var(--g100);color:var(--g600);padding:1px 5px;border-radius:8px;}
|
|
.model-row-toggle{font-size:12px;}
|
|
|
|
/* SSHADESS form */
|
|
.shadess-domain{margin-bottom:12px;padding:10px 12px;border-radius:8px;background:white;box-shadow:var(--shadow);}
|
|
.shadess-domain-header{display:flex;align-items:center;gap:8px;margin-bottom:8px;flex-wrap:wrap;}
|
|
.shadess-domain-body{display:flex;flex-direction:column;gap:6px;}
|
|
.shadess-q-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:3px 0;}
|
|
.shadess-q-text{font-size:13px;color:var(--g700);flex:1;min-width:200px;}
|
|
.shadess-concern-badge{font-size:11px;background:var(--red-light);color:var(--red);padding:2px 8px;border-radius:10px;font-weight:600;}
|
|
.shadess-flag-btn{font-size:11px;padding:2px 6px;}
|
|
|
|
/* Settings page */
|
|
.settings-page{display:flex;flex-direction:column;gap:0;}
|
|
.settings-page .settings-section{padding:20px;margin-bottom:12px;border-radius:var(--radius);}
|
|
.settings-page .settings-section h3{font-size:16px;font-weight:700;color:var(--g800);margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid var(--g100);display:flex;align-items:center;gap:8px;}
|
|
.settings-page .settings-section p{font-size:13px;color:var(--g600);margin-bottom:12px;line-height:1.6;}
|
|
.settings-page .hipaa-info ul{margin:10px 0 10px 20px;font-size:13px;}
|
|
.settings-page .hipaa-info li{margin-bottom:6px;line-height:1.5;}
|
|
.settings-page .form-group{margin-bottom:14px;}
|
|
.settings-page .form-group label{font-size:13px;font-weight:600;color:var(--g600);margin-bottom:4px;display:block;}
|
|
.settings-page .form-group input{width:100%;padding:8px 12px;border:1.5px solid var(--g300);border-radius:6px;font-size:13px;box-sizing:border-box;}
|
|
.settings-page .form-group input:focus{border-color:var(--blue);outline:none;box-shadow:0 0 0 2px var(--blue-light);}
|
|
|
|
/* Inline load popover — compact dropdown, right-aligned under Load button */
|
|
.enc-load-popover{position:absolute;right:0;top:calc(100% + 4px);width:360px;max-width:calc(100vw - 24px);background:white;border:1px solid var(--g300);border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,0.15);z-index:600;display:flex;flex-direction:column;}
|
|
.enc-load-popover.hidden{display:none;}
|
|
.enc-load-popover-inner{display:flex;align-items:center;gap:6px;padding:8px 10px;border-bottom:1px solid var(--g200);}
|
|
.enc-load-search{flex:1;padding:6px 10px;border:1px solid var(--g300);border-radius:6px;font-size:13px;font-family:inherit;}
|
|
.enc-load-search:focus{outline:none;border-color:var(--blue);}
|
|
.enc-pop-list{overflow-y:auto;max-height:260px;}
|
|
.enc-pop-item{display:flex;align-items:center;gap:8px;padding:9px 12px;cursor:pointer;border-bottom:1px solid var(--g100);}
|
|
.enc-pop-item:hover{background:var(--g50);}
|
|
.enc-pop-item:last-child{border-bottom:none;}
|
|
|
|
/* ===== ROS / PE / DX — Tasks 2, 3, 4, 6 ===== */
|
|
.ros-system-row{display:flex;align-items:center;gap:8px;padding:4px 0;border-bottom:1px solid var(--g100);}
|
|
.ros-system-row:last-child{border-bottom:none;}
|
|
.ros-system-name{flex:1;font-size:13px;color:var(--g700);}
|
|
.ros-status-btn{font-size:11px;padding:2px 8px;border-radius:12px;border:1px solid var(--g300);background:white;cursor:pointer;transition:all 0.15s;font-family:inherit;}
|
|
.ros-status-btn:hover{background:var(--g100);}
|
|
.ros-status-btn.wnl{background:var(--green-light);color:#166534;border-color:var(--green);}
|
|
.ros-status-btn.abnormal{background:var(--red-light);color:#991b1b;border-color:var(--red);}
|
|
.ros-status-btn.notrev{background:var(--g100);color:var(--g500);border-color:var(--g300);}
|
|
.ros-note-input{font-size:12px;padding:3px 8px;border:1px solid var(--g300);border-radius:6px;width:180px;display:none;font-family:inherit;}
|
|
.ros-note-input.visible{display:inline-block;}
|
|
.dx-tag{display:inline-flex;align-items:center;gap:4px;background:var(--blue-light);color:#1d4ed8;padding:3px 10px;border-radius:12px;font-size:12px;font-weight:600;margin:2px;}
|
|
.dx-tag .dx-remove{cursor:pointer;opacity:0.7;font-size:14px;line-height:1;}
|
|
.dx-tag .dx-remove:hover{opacity:1;}
|
|
.dx-chip{cursor:pointer;padding:3px 10px;background:var(--g100);border:1px solid var(--g200);border-radius:12px;font-size:11px;color:var(--g700);display:inline-block;margin:2px;transition:all 0.15s;}
|
|
.dx-chip:hover{background:var(--blue-light);color:var(--blue);border-color:var(--blue);}
|
|
.sv-section-card{background:white;border-radius:var(--radius);border:1px solid var(--g200);padding:0;margin-bottom:10px;box-shadow:var(--shadow);}
|
|
.sv-section-card .card-header{padding:10px 16px;border-bottom:1px solid var(--g100);display:flex;align-items:center;gap:8px;}
|
|
.sv-section-card .card-header h3{font-size:14px;font-weight:600;color:var(--g800);display:flex;align-items:center;gap:6px;}
|
|
.sv-section-card .card-body{padding:10px 16px;}
|
|
.visit-status-btn{font-size:11px;padding:2px 8px;border-radius:10px;border:1px solid var(--g300);background:white;cursor:pointer;transition:all 0.15s;font-family:inherit;}
|
|
.visit-status-btn.given,.visit-status-btn.done{background:var(--green-light);color:#166534;border-color:var(--green);}
|
|
.visit-status-btn.refused{background:var(--red-light);color:#991b1b;border-color:var(--red);}
|
|
.visit-status-btn.deferred,.visit-status-btn.not-due{background:var(--amber-light);color:#92400e;border-color:var(--amber);}
|
|
.visit-status-btn.already-done{background:var(--blue-light);color:#1e40af;border-color:var(--blue);}
|
|
@media(max-width:640px){
|
|
.ros-system-row{flex-wrap:wrap;}
|
|
.ros-note-input{width:100%;}
|
|
.dx-chip{font-size:10px;}
|
|
}
|
|
|
|
/* ICD-10 live search dropdown */
|
|
.dx-results{position:absolute;top:calc(100% + 2px);left:0;right:0;background:white;border:1px solid var(--g300);border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,0.12);z-index:400;max-height:240px;overflow-y:auto;}
|
|
.dx-result-item{padding:7px 12px;cursor:pointer;font-size:13px;border-bottom:1px solid var(--g100);}
|
|
.dx-result-item:last-child{border-bottom:none;}
|
|
.dx-result-item:hover{background:var(--g50);}
|
|
.dx-result-code{font-weight:700;color:var(--blue);margin-right:4px;}
|
|
|
|
/* ============================================================
|
|
LEARNING HUB
|
|
============================================================ */
|
|
|
|
/* Category bar */
|
|
.lh-category-bar{display:flex;gap:6px;flex-wrap:wrap;padding:8px 0;}
|
|
.lh-cat-pill{padding:5px 14px;border-radius:20px;border:1px solid var(--g300);background:white;font-size:13px;cursor:pointer;transition:all 0.15s;font-family:inherit;color:var(--g600);}
|
|
.lh-cat-pill:hover{border-color:var(--blue);color:var(--blue);}
|
|
.lh-cat-pill.active{background:var(--blue);color:white;border-color:var(--blue);}
|
|
|
|
/* Feed */
|
|
.lh-feed{display:flex;flex-direction:column;gap:8px;}
|
|
.lh-feed-item{padding:14px 16px;cursor:pointer;transition:box-shadow 0.15s,border-color 0.15s;}
|
|
.lh-feed-item:hover{box-shadow:var(--shadow-md);border-color:var(--blue-light);}
|
|
.lh-feed-item-header{display:flex;align-items:flex-start;gap:12px;}
|
|
.lh-feed-title{font-size:14px;font-weight:600;color:var(--g800);}
|
|
.lh-feed-meta{font-size:12px;color:var(--g500);display:flex;gap:8px;flex-wrap:wrap;margin-top:2px;}
|
|
.lh-feed-meta span:not(:last-child)::after{content:'·';margin-left:8px;color:var(--g300);}
|
|
.lh-feed-badges{display:flex;gap:6px;flex-shrink:0;align-items:flex-start;}
|
|
.lh-badge{font-size:11px;padding:2px 8px;border-radius:10px;background:var(--g100);color:var(--g600);white-space:nowrap;}
|
|
.lh-badge-quiz{background:var(--amber-light);color:#92400e;}
|
|
|
|
/* Viewer */
|
|
.lh-viewer .card{margin-bottom:0;}
|
|
.lh-content-body{font-size:14px;line-height:1.75;color:var(--g700);}
|
|
.lh-content-body h1,.lh-content-body h2,.lh-content-body h3{margin:16px 0 8px;color:var(--g800);}
|
|
.lh-content-body p{margin-bottom:12px;}
|
|
.lh-content-body ul,.lh-content-body ol{margin:0 0 12px 20px;}
|
|
.lh-content-body li{margin-bottom:4px;}
|
|
.lh-content-body strong{color:var(--g900);}
|
|
.lh-content-body code{background:var(--g100);padding:2px 6px;border-radius:4px;font-size:13px;}
|
|
.lh-content-body blockquote{border-left:3px solid var(--blue);padding:8px 16px;margin:12px 0;background:var(--blue-light);border-radius:0 6px 6px 0;font-style:italic;}
|
|
.lh-content-body table{width:100%;border-collapse:collapse;margin:12px 0;}
|
|
.lh-content-body th,.lh-content-body td{padding:8px 12px;border:1px solid var(--g200);font-size:13px;}
|
|
.lh-content-body th{background:var(--g50);font-weight:600;}
|
|
|
|
/* Quiz — large, visual question cards */
|
|
.lh-quiz-q{margin-bottom:24px;padding:20px;background:white;border:1.5px solid var(--g200);border-radius:12px;box-shadow:0 1px 4px rgba(0,0,0,0.04);}
|
|
.lh-quiz-q:last-child{margin-bottom:0;}
|
|
.lh-quiz-q-header{display:flex;gap:10px;align-items:center;margin-bottom:10px;}
|
|
.lh-quiz-q-num{font-size:13px;font-weight:700;color:white;background:linear-gradient(135deg,var(--blue),var(--purple));padding:4px 12px;border-radius:8px;min-width:32px;text-align:center;}
|
|
.lh-quiz-q-type{font-size:11px;color:var(--g400);background:var(--g100);padding:2px 8px;border-radius:4px;}
|
|
.lh-quiz-q-text{font-size:16px;font-weight:600;margin-bottom:14px;color:var(--g800);line-height:1.5;}
|
|
.lh-quiz-options{display:flex;flex-direction:column;gap:8px;}
|
|
.lh-quiz-option{display:flex;align-items:center;gap:12px;padding:14px 18px;border:2px solid var(--g200);border-radius:10px;cursor:pointer;transition:all 0.2s;font-size:14px;line-height:1.4;background:white;user-select:none;}
|
|
.lh-quiz-option:hover{border-color:var(--blue);background:var(--blue-light);transform:translateY(-1px);box-shadow:0 2px 8px rgba(37,99,235,0.1);}
|
|
.lh-quiz-option input[type="radio"]{accent-color:var(--blue);width:18px;height:18px;flex-shrink:0;}
|
|
.lh-quiz-option span{flex:1;}
|
|
.lh-opt-correct{border-color:var(--green) !important;background:var(--green-light) !important;box-shadow:0 0 0 2px rgba(16,185,129,0.2) !important;}
|
|
.lh-opt-wrong{border-color:var(--red) !important;background:var(--red-light) !important;box-shadow:0 0 0 2px rgba(239,68,68,0.2) !important;}
|
|
|
|
/* Quiz results */
|
|
.lh-result-item{margin-bottom:14px;padding-bottom:14px;border-bottom:1px solid var(--g100);}
|
|
.lh-result-item:last-child{border-bottom:none;}
|
|
.lh-result-header{font-size:14px;margin-bottom:6px;}
|
|
.lh-expl{font-size:13px;padding:8px 12px;border-radius:6px;margin-top:6px;}
|
|
.lh-expl-wrong{background:var(--red-light);color:#991b1b;}
|
|
.lh-expl-correct{background:var(--green-light);color:#166534;}
|
|
.lh-expl-general{background:var(--blue-light);color:#1e40af;}
|
|
|
|
/* CMS question builder */
|
|
.lh-question-block{padding:16px;border:1.5px solid var(--g200);border-radius:10px;margin-bottom:12px;background:white;box-shadow:0 1px 3px rgba(0,0,0,0.04);transition:outline 0.2s;}
|
|
|
|
/* ============================================================
|
|
CONTENT MANAGER (WordPress-like CMS)
|
|
============================================================ */
|
|
|
|
/* Stats bar */
|
|
.cms-stats-bar{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap;}
|
|
.cms-stat{flex:1;min-width:90px;background:white;border:1px solid var(--g200);border-radius:10px;padding:12px 16px;text-align:center;}
|
|
.cms-stat-value{display:block;font-size:22px;font-weight:700;color:var(--blue);}
|
|
.cms-stat-label{font-size:11px;color:var(--g500);text-transform:uppercase;letter-spacing:0.5px;}
|
|
|
|
/* Layout */
|
|
.cms-layout{display:grid;grid-template-columns:220px 1fr;gap:16px;min-height:500px;}
|
|
.cms-sidebar{display:flex;flex-direction:column;gap:12px;}
|
|
.cms-sidebar-section{background:white;border:1px solid var(--g200);border-radius:10px;padding:14px;}
|
|
.cms-sidebar-section h4{margin:0 0 10px;font-size:13px;color:var(--g600);display:flex;align-items:center;gap:6px;}
|
|
.cms-main{background:white;border:1px solid var(--g200);border-radius:10px;overflow:visible;}
|
|
|
|
/* Category list in sidebar */
|
|
.cms-cat-list{display:flex;flex-direction:column;gap:2px;margin-bottom:8px;}
|
|
.cms-cat-item{display:flex;align-items:center;justify-content:space-between;padding:6px 8px;border-radius:6px;font-size:13px;cursor:default;}
|
|
.cms-cat-item:hover{background:var(--g50);}
|
|
.cms-cat-item .cms-cat-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
|
|
.cms-cat-item .cms-cat-count{font-size:11px;color:var(--g400);margin:0 6px;}
|
|
.cms-add-cat{display:flex;gap:4px;margin:0;}
|
|
.cms-add-cat .cms-input-sm{flex:1;min-width:0;width:0;}
|
|
.cms-btn-add{flex-shrink:0;min-width:44px;padding:6px 10px;border:1px solid var(--g300);border-radius:6px;background:white;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--blue);font-size:12px;}
|
|
.cms-btn-add:hover{background:var(--blue-light);}
|
|
|
|
/* Input small */
|
|
.cms-input-sm{font-size:13px;padding:6px 10px;border:1px solid var(--g300);border-radius:6px;font-family:inherit;background:white;box-sizing:border-box;}
|
|
.cms-input-sm:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 2px var(--blue-light);}
|
|
|
|
/* Toolbar */
|
|
.cms-toolbar{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid var(--g200);gap:12px;}
|
|
.cms-search{display:flex;align-items:center;gap:6px;border:1px solid var(--g300);border-radius:6px;padding:0 10px;background:white;flex:1;max-width:280px;}
|
|
.cms-search i{color:var(--g400);font-size:12px;}
|
|
.cms-search input{border:none;outline:none;font-size:13px;padding:6px 0;width:100%;background:transparent;}
|
|
|
|
/* Content table */
|
|
.cms-content-table{font-size:13px;}
|
|
.cms-table-header{display:grid;grid-template-columns:1fr 110px 80px 80px 90px 40px;gap:8px;padding:8px 16px;background:var(--g50);border-bottom:1px solid var(--g200);font-weight:600;color:var(--g500);font-size:11px;text-transform:uppercase;letter-spacing:0.5px;}
|
|
.cms-table-body{max-height:calc(100vh - 340px);overflow-y:auto;}
|
|
.cms-table-row{display:grid;grid-template-columns:1fr 110px 80px 80px 90px 40px;gap:8px;padding:10px 16px;border-bottom:1px solid var(--g100);align-items:center;cursor:pointer;transition:background 0.1s;}
|
|
.cms-table-row:hover{background:var(--g50);}
|
|
.cms-col-title{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
|
|
.cms-col-title .cms-title-sub{font-size:11px;color:var(--g400);font-weight:400;}
|
|
.cms-col-cat,.cms-col-type,.cms-col-date{color:var(--g500);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
|
|
.cms-col-status .cms-badge{font-size:11px;padding:2px 8px;border-radius:10px;font-weight:500;}
|
|
.cms-badge-pub{background:var(--green-light);color:#166534;}
|
|
.cms-badge-draft{background:var(--g100);color:var(--g500);}
|
|
.cms-col-actions{text-align:center;}
|
|
|
|
/* Editor */
|
|
.cms-editor{padding:16px 20px;}
|
|
.cms-editor-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;flex-wrap:wrap;gap:8px;}
|
|
.cms-editor-actions{display:flex;gap:8px;align-items:center;position:relative;z-index:2;}
|
|
.cms-title-input{width:100%;font-size:22px;font-weight:600;padding:10px 0;border:none;border-bottom:2px solid var(--g200);outline:none;font-family:inherit;color:var(--g800);margin-bottom:12px;}
|
|
.cms-title-input:focus{border-bottom-color:var(--blue);}
|
|
.cms-meta-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-bottom:16px;}
|
|
.cms-meta-field label{display:block;font-size:11px;font-weight:600;color:var(--g500);margin-bottom:3px;text-transform:uppercase;letter-spacing:0.3px;}
|
|
.cms-meta-field select,.cms-meta-field input{width:100%;}
|
|
.cms-label{display:block;font-size:12px;font-weight:600;color:var(--g600);margin-bottom:6px;}
|
|
.cms-body-editor{width:100%;font-size:13px;line-height:1.6;padding:14px;border:1px solid var(--g300);border-radius:8px;resize:vertical;box-sizing:border-box;font-family:'Courier New',monospace;background:var(--g50);min-height:200px;}
|
|
.cms-body-editor:focus{outline:none;border-color:var(--blue);background:white;box-shadow:0 0 0 2px var(--blue-light);}
|
|
.cms-body-section{margin-bottom:20px;}
|
|
|
|
/* Quiz section in editor */
|
|
.cms-quiz-section{border-top:2px solid var(--g200);padding-top:16px;}
|
|
.cms-quiz-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;}
|
|
.cms-quiz-header h3{margin:0;font-size:15px;color:var(--g700);}
|
|
|
|
/* Editor toolbar */
|
|
.cms-editor-toolbar{display:flex;gap:2px;padding:6px 8px;background:var(--g50);border:1px solid var(--g300);border-bottom:none;border-radius:8px 8px 0 0;flex-wrap:wrap;}
|
|
.cms-tb-btn{width:32px;height:28px;border:none;background:transparent;cursor:pointer;border-radius:4px;font-size:12px;color:var(--g600);display:flex;align-items:center;justify-content:center;font-family:inherit;font-weight:600;}
|
|
.cms-tb-btn:hover{background:var(--g200);color:var(--g800);}
|
|
.cms-tb-sep{width:1px;background:var(--g300);margin:2px 4px;align-self:stretch;}
|
|
.cms-body-section .cms-body-editor{border-radius:0 0 8px 8px;}
|
|
|
|
/* Mobile responsive */
|
|
@media(max-width:768px){
|
|
.cms-layout{grid-template-columns:1fr;}
|
|
.cms-sidebar{flex-direction:row;overflow-x:auto;gap:8px;}
|
|
.cms-sidebar-section{min-width:200px;flex-shrink:0;}
|
|
.cms-table-header,.cms-table-row{grid-template-columns:1fr 80px 70px;font-size:12px;}
|
|
.cms-col-cat,.cms-col-date,.cms-col-actions{display:none;}
|
|
.cms-meta-row{grid-template-columns:1fr;gap:8px;}
|
|
.cms-stats-bar{gap:4px;}
|
|
.cms-stat{padding:8px 10px;}
|
|
.cms-stat-value{font-size:18px;}
|
|
}
|
|
.lh-option-row{display:flex;align-items:flex-start;gap:8px;margin-bottom:6px;padding:6px 8px;border-radius:6px;background:var(--g50);}
|
|
|
|
@media(max-width:640px){
|
|
.lh-feed-item-header{flex-direction:column;gap:6px;}
|
|
.lh-feed-badges{align-self:flex-start;}
|
|
.lh-option-row{flex-wrap:wrap;}
|
|
.lh-option-row .lh-opt-expl{width:100%;}
|
|
}
|
|
|
|
/* ── Tiptap editor ────────────────────────────────────────── */
|
|
.cms-quill-body{border:1px solid var(--g300);border-radius:8px;background:white;overflow:hidden;}
|
|
.cms-quill-body .tp-content .ProseMirror{min-height:280px;padding:16px;outline:none;font-size:14px;font-family:'Inter',system-ui,sans-serif;line-height:1.6;}
|
|
|
|
/* Shared ProseMirror content styles */
|
|
.ProseMirror{outline:none;}
|
|
.ProseMirror p{margin-bottom:8px;}
|
|
.ProseMirror h2{font-size:20px;font-weight:700;margin:16px 0 8px;}
|
|
.ProseMirror h3{font-size:16px;font-weight:600;margin:12px 0 6px;}
|
|
.ProseMirror blockquote{border-left:4px solid var(--blue);padding-left:12px;color:var(--g600);margin:10px 0;}
|
|
.ProseMirror pre{background:var(--g900);color:#e5e7eb;padding:12px;border-radius:6px;font-size:13px;overflow-x:auto;}
|
|
.ProseMirror ul{padding-left:20px;margin-bottom:8px;}
|
|
.ProseMirror ol{padding-left:20px;margin-bottom:8px;}
|
|
.ProseMirror li{margin-bottom:3px;}
|
|
.ProseMirror a{color:var(--blue);text-decoration:underline;}
|
|
.ProseMirror code{background:var(--g100);padding:1px 5px;border-radius:3px;font-size:0.9em;}
|
|
.ProseMirror p.is-editor-empty:first-child::before{content:attr(data-placeholder);color:var(--g400);pointer-events:none;float:left;height:0;}
|
|
|
|
/* Tiptap toolbar */
|
|
.tp-toolbar{display:flex;flex-wrap:wrap;gap:2px;padding:6px 8px;background:var(--g50);border-bottom:1px solid var(--g200);}
|
|
.tp-btn{height:28px;min-width:28px;padding:0 6px;border:none;background:transparent;cursor:pointer;border-radius:4px;font-size:12px;color:var(--g600);display:inline-flex;align-items:center;justify-content:center;font-family:inherit;font-weight:600;transition:background 0.1s;}
|
|
.tp-btn:hover{background:var(--g200);color:var(--g800);}
|
|
.tp-btn.active{background:var(--blue-light);color:var(--blue);}
|
|
.tp-sep{width:1px;background:var(--g300);margin:2px 3px;align-self:stretch;}
|
|
.tp-toolbar-mini{padding:4px 6px;}
|
|
.tp-toolbar-mini .tp-btn{height:24px;min-width:24px;font-size:11px;}
|
|
|
|
/* Link bar — inline, no popup */
|
|
.tp-link-bar{display:none;align-items:center;gap:6px;padding:6px 10px;background:#fffbeb;border-bottom:1px solid var(--amber);font-size:13px;}
|
|
.tp-link-input{flex:1;padding:5px 10px;border:1px solid var(--g300);border-radius:6px;font-size:13px;font-family:inherit;min-width:0;}
|
|
.tp-link-apply{padding:4px 12px;background:var(--blue);color:white;border:none;border-radius:6px;cursor:pointer;font-size:12px;font-weight:600;}
|
|
.tp-link-apply:hover{background:#1d4ed8;}
|
|
.tp-link-remove{padding:4px 10px;background:var(--red-light);color:var(--red);border:1px solid var(--red);border-radius:6px;cursor:pointer;font-size:12px;}
|
|
.tp-link-cancel{padding:4px 8px;background:transparent;border:none;cursor:pointer;color:var(--g400);font-size:14px;}
|
|
.tp-content{position:relative;}
|
|
|
|
/* Mini richtext wraps for questions/options */
|
|
.lh-q-richtext-wrap{border:1.5px solid var(--g300);border-radius:8px;overflow:hidden;margin-bottom:8px;}
|
|
.lh-q-richtext-wrap .tp-content .ProseMirror{min-height:60px;padding:10px;font-size:14px;}
|
|
.lh-opt-richtext-wrap{border:1.5px solid var(--g300);border-radius:6px;overflow:hidden;flex:2;}
|
|
.lh-opt-richtext-wrap .tp-content .ProseMirror{min-height:36px;padding:6px 8px;font-size:13px;}
|
|
|
|
/* Rich text toggle button */
|
|
.lh-richtext-btn{font-size:11px;padding:3px 8px;border:1px solid var(--g300);border-radius:4px;background:white;cursor:pointer;color:var(--g500);white-space:nowrap;}
|
|
.lh-richtext-btn.active{background:var(--blue-light);border-color:var(--blue);color:var(--blue);font-weight:600;}
|
|
|
|
/* Multi-select quiz options */
|
|
.lh-quiz-option input[type="checkbox"]{accent-color:var(--blue);width:18px;height:18px;flex-shrink:0;}
|
|
.lh-quiz-multi-hint{font-size:12px;color:var(--g500);margin-bottom:10px;font-style:italic;}
|
|
|
|
/* ── Inline delete confirmation bar ──────────────────────── */
|
|
/* display:flex is NOT set here — .hidden (display:none) must win */
|
|
.lh-delete-confirm-bar{align-items:center;gap:10px;padding:10px 16px;background:#fef2f2;border:1.5px solid #fca5a5;border-radius:10px;margin-bottom:12px;font-size:13px;color:#991b1b;flex-wrap:wrap;}
|
|
.lh-delete-confirm-bar:not(.hidden){display:flex;}
|
|
.lh-delete-confirm-bar i{color:var(--red);flex-shrink:0;}
|
|
|
|
/* ── Marp / Presentation editor ──────────────────────────── */
|
|
.lh-marp-textarea{width:100%;min-height:320px;font-family:'Courier New',monospace;font-size:13px;line-height:1.6;padding:14px;border:1px solid var(--g300);border-radius:8px;resize:vertical;box-sizing:border-box;background:var(--g900);color:#e5e7eb;outline:none;}
|
|
.lh-marp-textarea:focus{border-color:var(--blue);box-shadow:0 0 0 2px var(--blue-light);}
|
|
|
|
/* ── Slide preview modal ──────────────────────────────────── */
|
|
.slide-preview-modal{position:fixed;inset:0;z-index:9000;display:flex;align-items:center;justify-content:center;}
|
|
.slide-preview-modal.hidden{display:none;}
|
|
.slide-preview-overlay{position:absolute;inset:0;background:rgba(0,0,0,0.85);}
|
|
.slide-preview-shell{position:relative;z-index:1;width:100%;height:100%;display:flex;flex-direction:column;padding:12px;}
|
|
.slide-preview-topbar{display:flex;align-items:center;justify-content:space-between;padding:0 0 10px;flex-shrink:0;}
|
|
.slide-preview-counter{font-size:14px;font-weight:700;color:white;background:rgba(255,255,255,0.15);padding:4px 14px;border-radius:20px;}
|
|
.slide-preview-close{background:rgba(255,255,255,0.15);border:none;color:white;padding:6px 16px;border-radius:8px;cursor:pointer;font-size:13px;font-weight:600;transition:background 0.15s;}
|
|
.slide-preview-close:hover{background:rgba(255,255,255,0.25);}
|
|
.slide-preview-stage{flex:1;display:flex;align-items:center;justify-content:center;gap:12px;min-height:0;overflow:hidden;}
|
|
.slide-preview-frame{flex:1;max-width:900px;background:white;border-radius:8px;overflow:auto;box-shadow:0 8px 40px rgba(0,0,0,0.6);max-height:100%;display:flex;flex-direction:column;}
|
|
.slide-preview-frame section{all:unset;display:block;padding:40px 48px !important;box-sizing:border-box;}
|
|
.slide-preview-frame section *{box-sizing:border-box;}
|
|
.slide-nav-btn{background:rgba(255,255,255,0.15);border:none;color:white;font-size:36px;line-height:1;padding:10px 14px;border-radius:10px;cursor:pointer;flex-shrink:0;transition:background 0.15s;user-select:none;}
|
|
.slide-nav-btn:hover{background:rgba(255,255,255,0.25);}
|
|
.slide-preview-dots{display:flex;justify-content:center;gap:6px;padding-top:10px;flex-shrink:0;flex-wrap:wrap;}
|
|
.slide-dot{width:10px;height:10px;border-radius:50%;border:none;background:rgba(255,255,255,0.3);cursor:pointer;padding:0;transition:background 0.15s;}
|
|
.slide-dot.active{background:white;}
|
|
@media(max-width:600px){
|
|
.slide-nav-btn{font-size:24px;padding:8px 10px;}
|
|
.slide-preview-topbar span:nth-child(2){display:none;}
|
|
}
|
|
|
|
/* ── AI Generate panel ────────────────────────────────────── */
|
|
.lh-ai-panel{border:2px solid transparent;background:linear-gradient(white,white) padding-box,linear-gradient(135deg,#7c3aed,#2563eb) border-box;border-radius:12px;padding:20px;margin-bottom:16px;}
|
|
.lh-ai-panel-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;}
|
|
.lh-ai-tabs{display:flex;gap:4px;margin-bottom:14px;border-bottom:1px solid var(--g200);padding-bottom:10px;}
|
|
.lh-ai-tab{padding:6px 14px;border:1px solid var(--g200);border-radius:8px;background:white;cursor:pointer;font-size:13px;font-weight:500;color:var(--g600);display:flex;align-items:center;gap:6px;transition:all 0.15s;}
|
|
.lh-ai-tab:hover{border-color:var(--blue);color:var(--blue);}
|
|
.lh-ai-tab.active{background:var(--blue-light);border-color:var(--blue);color:var(--blue);font-weight:600;}
|
|
.lh-ai-tabpanel{margin-bottom:14px;}
|
|
.lh-ai-dropzone{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;border:2px dashed var(--g300);border-radius:10px;cursor:pointer;text-align:center;font-size:13px;color:var(--g600);transition:border-color 0.2s;background:var(--g50);}
|
|
.lh-ai-dropzone:hover{border-color:var(--blue);background:var(--blue-light);}
|
|
.lh-ai-options{display:flex;flex-direction:column;gap:10px;margin-bottom:14px;padding:14px;background:var(--g50);border-radius:8px;}
|
|
.lh-ai-opt-row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;}
|
|
.lh-ai-opt-field{display:flex;flex-direction:column;gap:3px;}
|
|
.lh-ai-opt-field label{font-size:11px;font-weight:600;color:var(--g500);text-transform:uppercase;letter-spacing:0.3px;}
|
|
|
|
/* Quiz questions card inside AI panel */
|
|
.lh-ai-quiz-card{background:linear-gradient(135deg,#eff6ff,#eef2ff);border:1.5px solid #c7d2fe;border-radius:10px;overflow:hidden;}
|
|
.lh-ai-quiz-card-header{display:flex;align-items:center;gap:8px;padding:10px 14px;background:white;border-bottom:1px solid #e0e7ff;}
|
|
.lh-ai-quiz-card-body{padding:12px 14px;display:flex;flex-wrap:wrap;align-items:center;gap:12px;}
|
|
|
|
/* WebDAV browser */
|
|
.lh-webdav-item{display:flex;align-items:center;gap:8px;padding:8px 12px;font-size:13px;cursor:pointer;border-bottom:1px solid var(--g100);transition:background 0.1s;}
|
|
.lh-webdav-item:last-child{border-bottom:none;}
|
|
.lh-webdav-item:hover{background:var(--g50);}
|
|
.lh-webdav-dir{color:var(--g700);font-weight:500;}
|
|
.lh-webdav-file{color:var(--g600);}
|
|
.lh-webdav-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
|
|
|
|
/* ── Notes tab — personal scratchpad (under Clinical Tools) ───── */
|
|
.notes-layout{display:grid;grid-template-columns:320px 1fr;gap:14px;align-items:flex-start;min-height:70vh;}
|
|
@media (max-width:900px){.notes-layout{grid-template-columns:1fr;}}
|
|
|
|
.notes-sidebar{background:white;border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;display:flex;flex-direction:column;max-height:80vh;}
|
|
.notes-sidebar-head{padding:10px;border-bottom:1px solid var(--g200);background:var(--g50);display:flex;flex-direction:column;gap:8px;}
|
|
.notes-new-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px 12px;font-size:13px;font-weight:600;}
|
|
.notes-search{position:relative;}
|
|
.notes-search i{position:absolute;top:50%;left:10px;transform:translateY(-50%);color:var(--g400);font-size:12px;pointer-events:none;}
|
|
.notes-search input{width:100%;padding:7px 10px 7px 30px;border:1px solid var(--g300);border-radius:6px;font-size:13px;font-family:inherit;box-sizing:border-box;background:white;}
|
|
.notes-search input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-light);}
|
|
|
|
.notes-list{flex:1;overflow-y:auto;padding:4px;}
|
|
.notes-empty{padding:24px 14px;text-align:center;color:var(--g400);font-size:13px;line-height:1.5;}
|
|
.notes-list-item{display:block;width:100%;text-align:left;padding:10px 12px;border:none;background:transparent;border-radius:8px;cursor:pointer;margin-bottom:2px;font-family:inherit;transition:background 0.1s;border-left:3px solid transparent;}
|
|
.notes-list-item:hover{background:var(--g50);}
|
|
.notes-list-item.active{background:var(--blue-light);border-left-color:var(--blue);}
|
|
.notes-list-title{font-size:13.5px;font-weight:600;color:var(--g800);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:2px;}
|
|
.notes-list-snippet{font-size:12px;color:var(--g500);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.35;}
|
|
.notes-list-when{font-size:11px;color:var(--g400);margin-top:4px;}
|
|
|
|
.notes-editor{background:white;border-radius:var(--radius);box-shadow:var(--shadow);display:flex;flex-direction:column;min-height:70vh;}
|
|
.notes-editor.hidden{display:none;}
|
|
.notes-editor-head{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--g200);background:var(--g50);border-top-left-radius:var(--radius);border-top-right-radius:var(--radius);flex-wrap:wrap;}
|
|
.notes-title-input{flex:1;min-width:180px;padding:8px 10px;border:1px solid transparent;border-radius:6px;font-size:16px;font-weight:600;color:var(--g900);font-family:inherit;background:transparent;}
|
|
.notes-title-input:focus{outline:none;background:white;border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-light);}
|
|
.notes-editor-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
|
|
.notes-status{font-size:12px;color:var(--g500);min-width:60px;text-align:right;}
|
|
.notes-status-dirty{color:var(--amber);}
|
|
.notes-status-saving{color:var(--g500);}
|
|
.notes-status-ok{color:#059669;}
|
|
.notes-status-err{color:var(--red);}
|
|
|
|
.notes-body-editor{flex:1;display:flex;flex-direction:column;min-height:280px;}
|
|
.notes-body-editor .tp-toolbar{position:sticky;top:0;z-index:5;}
|
|
.notes-body-editor .tp-content{flex:1;padding:14px 18px;font-size:14px;line-height:1.6;color:var(--g800);overflow-y:auto;min-height:220px;}
|
|
.notes-body-editor .tp-content:focus-within .ProseMirror{outline:none;}
|
|
.notes-body-editor .ProseMirror{outline:none;min-height:200px;}
|
|
.notes-body-editor .ProseMirror p{margin:0 0 8px;}
|
|
.notes-body-editor .ProseMirror h2{font-size:18px;font-weight:700;color:var(--g900);margin:16px 0 8px;}
|
|
.notes-body-editor .ProseMirror h3{font-size:15px;font-weight:700;color:var(--g800);margin:12px 0 6px;}
|
|
.notes-body-editor .ProseMirror ul,.notes-body-editor .ProseMirror ol{margin:0 0 8px 24px;}
|
|
.notes-body-editor .ProseMirror blockquote{border-left:3px solid var(--g300);margin:0 0 8px;padding:2px 0 2px 12px;color:var(--g600);font-style:italic;}
|
|
.notes-body-editor .ProseMirror pre{background:var(--g900);color:#e5e7eb;padding:10px 14px;border-radius:6px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12.5px;overflow-x:auto;margin:0 0 8px;}
|
|
.notes-body-editor .ProseMirror code{background:var(--g100);padding:1px 5px;border-radius:4px;font-size:12.5px;}
|
|
.notes-body-editor .ProseMirror a{color:var(--blue);text-decoration:underline;}
|
|
.notes-body-editor .notes-body-fallback{width:100%;height:100%;min-height:260px;padding:14px 18px;border:none;font-size:14px;line-height:1.6;font-family:inherit;color:var(--g800);resize:vertical;box-sizing:border-box;}
|
|
|
|
.notes-editor-foot{padding:8px 14px;border-top:1px solid var(--g200);font-size:11px;color:var(--g400);display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;}
|
|
.notes-meta{font-size:11px;color:var(--g400);}
|
|
|
|
.notes-empty-state{background:white;border-radius:var(--radius);box-shadow:var(--shadow);padding:60px 24px;text-align:center;color:var(--g400);display:flex;flex-direction:column;align-items:center;gap:14px;min-height:70vh;justify-content:center;}
|
|
.notes-empty-state i{font-size:64px;color:var(--g300);}
|
|
.notes-empty-state p{font-size:14px;line-height:1.5;max-width:320px;margin:0;}
|
|
.notes-empty-state.hidden{display:none;}
|
|
|
|
/* Voice-to-note recording bar inside the editor head.
|
|
Each rule has an explicit `.hidden` override — the generic
|
|
.hidden{display:none} at line 317 loses to these single-class
|
|
rules on source order, so we need to re-assert it here. */
|
|
.notes-voice-bar{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:0;}
|
|
.notes-voice-bar .btn-sm{font-size:12px;padding:6px 10px;}
|
|
.notes-voice-bar .btn-sm.hidden{display:none;}
|
|
.notes-rec-indicator{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--red);font-weight:600;}
|
|
.notes-rec-indicator.hidden{display:none;}
|
|
.notes-rec-indicator .pulse-dot{width:8px;height:8px;background:var(--red);border-radius:50%;animation:notes-pulse 1.2s ease-in-out infinite;}
|
|
.notes-rec-indicator .pulse-dot.paused{animation:none;opacity:0.5;}
|
|
@keyframes notes-pulse{0%,100%{opacity:1;transform:scale(1);}50%{opacity:0.35;transform:scale(1.25);}}
|
|
.notes-rec-timer{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px;color:var(--g600);}
|
|
|
|
/* Notes — friendlier touches */
|
|
.notes-empty-state .notes-empty-card{max-width:440px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:12px;}
|
|
.notes-empty-icon{width:72px;height:72px;border-radius:50%;background:linear-gradient(135deg,#fef3c7,#fde68a);display:inline-flex;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(245,158,11,0.25);}
|
|
.notes-empty-icon i{font-size:30px;color:#b45309;}
|
|
.notes-empty-state h3{margin:4px 0 0;font-size:20px;font-weight:600;color:var(--g800);}
|
|
.notes-empty-state p{font-size:14px;line-height:1.55;color:var(--g500);margin:0;}
|
|
.notes-empty-cta{margin-top:4px;padding:10px 20px;border-radius:10px;font-weight:600;display:inline-flex;align-items:center;gap:8px;box-shadow:0 2px 6px rgba(37,99,235,0.25);}
|
|
.notes-empty-cta:hover{box-shadow:0 4px 10px rgba(37,99,235,0.35);}
|
|
.notes-empty-tips{margin-top:16px;display:flex;flex-direction:column;gap:8px;font-size:12.5px;color:var(--g500);text-align:left;align-self:stretch;padding:14px 18px;background:var(--g50);border-radius:10px;}
|
|
.notes-empty-tips div{display:flex;align-items:center;gap:10px;}
|
|
.notes-empty-tips i{color:var(--blue);font-size:13px;width:16px;text-align:center;}
|
|
.notes-empty-tips kbd{background:white;border:1px solid var(--g300);border-radius:4px;padding:1px 6px;font-size:11px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;box-shadow:0 1px 0 var(--g200);}
|
|
|
|
.notes-list-item{position:relative;transition:background 0.15s, transform 0.15s;}
|
|
.notes-list-item:hover{transform:translateX(1px);}
|
|
.notes-list-item.active{box-shadow:inset 0 0 0 1px var(--blue-light);}
|
|
|
|
.notes-sidebar-head{padding:12px;}
|
|
.notes-new-btn{border-radius:10px;padding:9px 14px;font-size:13.5px;box-shadow:0 1px 3px rgba(37,99,235,0.2);}
|
|
.notes-new-btn:hover{box-shadow:0 2px 6px rgba(37,99,235,0.3);}
|
|
|
|
.notes-title-input{font-size:18px;letter-spacing:-0.01em;}
|
|
.notes-title-input::placeholder{color:var(--g400);font-weight:500;}
|
|
|
|
.notes-editor-head{gap:12px;padding:12px 16px;}
|
|
.notes-body-editor{border-bottom-left-radius:var(--radius);border-bottom-right-radius:var(--radius);}
|
|
.notes-body-editor .tp-toolbar{border-bottom:1px solid var(--g100);background:#fdfdfd;}
|
|
|
|
/* subtle card float on hover for the whole editor */
|
|
.notes-editor{transition:box-shadow 0.2s;}
|
|
.notes-editor:hover{box-shadow:0 4px 16px rgba(0,0,0,0.06);}
|
|
|
|
/* ── Notes: reader mode + mobile layout ──────────────────────── */
|
|
|
|
/* Reader pane — clean read-only view of a saved note */
|
|
.notes-reader{background:white;border-radius:var(--radius);box-shadow:var(--shadow);display:flex;flex-direction:column;min-height:70vh;}
|
|
.notes-reader.hidden{display:none;}
|
|
.notes-reader-head{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--g200);background:linear-gradient(180deg,#fdfdfd,#f9fafb);border-top-left-radius:var(--radius);border-top-right-radius:var(--radius);}
|
|
.notes-reader-title{flex:1;margin:0;font-size:20px;font-weight:600;color:var(--g900);letter-spacing:-0.01em;overflow-wrap:anywhere;}
|
|
.notes-reader-actions{display:flex;align-items:center;gap:6px;flex-shrink:0;}
|
|
.notes-reader-body{flex:1;padding:22px 24px;font-size:15px;line-height:1.7;color:var(--g800);overflow-y:auto;}
|
|
.notes-reader-body p{margin:0 0 12px;}
|
|
.notes-reader-body h2{font-size:20px;font-weight:700;color:var(--g900);margin:20px 0 10px;}
|
|
.notes-reader-body h3{font-size:16px;font-weight:700;color:var(--g800);margin:16px 0 8px;}
|
|
.notes-reader-body ul,.notes-reader-body ol{margin:0 0 12px 24px;}
|
|
.notes-reader-body li{margin-bottom:4px;}
|
|
.notes-reader-body blockquote{border-left:3px solid var(--g300);margin:0 0 12px;padding:4px 0 4px 14px;color:var(--g600);font-style:italic;}
|
|
.notes-reader-body code{background:var(--g100);padding:1px 6px;border-radius:4px;font-size:13.5px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;}
|
|
.notes-reader-body pre{background:var(--g900);color:#e5e7eb;padding:12px 16px;border-radius:8px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13px;overflow-x:auto;margin:0 0 12px;}
|
|
.notes-reader-body pre code{background:transparent;padding:0;color:inherit;}
|
|
.notes-reader-body a{color:var(--blue);text-decoration:underline;}
|
|
.notes-reader-foot{padding:10px 18px;border-top:1px solid var(--g200);font-size:11px;color:var(--g400);background:var(--g50);}
|
|
|
|
/* Back button for mobile navigation (shown in reader + editor heads) */
|
|
.notes-back{display:none !important;padding:6px 10px;}
|
|
|
|
/* Mobile: single-pane layout driven by .notes-layout[data-view=…] */
|
|
@media (max-width:900px){
|
|
.notes-layout{grid-template-columns:1fr;gap:0;}
|
|
.notes-sidebar,.notes-reader,.notes-editor,.notes-empty-state{max-height:none;}
|
|
|
|
/* Show only the pane matching data-view; hide the others. The empty-
|
|
state card is purely a desktop affordance ("nothing picked yet,
|
|
pick from the sidebar"); on mobile the sidebar IS the list, so
|
|
we hide empty-state whenever the sidebar is showing. */
|
|
.notes-layout[data-view="list"] .notes-reader,
|
|
.notes-layout[data-view="list"] .notes-editor,
|
|
.notes-layout[data-view="list"] .notes-empty-state,
|
|
.notes-layout[data-view="reader"] .notes-sidebar,
|
|
.notes-layout[data-view="reader"] .notes-editor,
|
|
.notes-layout[data-view="reader"] .notes-empty-state,
|
|
.notes-layout[data-view="editor"] .notes-sidebar,
|
|
.notes-layout[data-view="editor"] .notes-reader,
|
|
.notes-layout[data-view="editor"] .notes-empty-state,
|
|
.notes-layout[data-view="empty"] .notes-reader,
|
|
.notes-layout[data-view="empty"] .notes-editor{display:none !important;}
|
|
|
|
.notes-back{display:inline-flex !important;}
|
|
|
|
.notes-reader-head,.notes-editor-head{padding:10px 12px;gap:8px;}
|
|
.notes-reader-title{font-size:17px;}
|
|
.notes-reader-body{padding:16px;font-size:14.5px;}
|
|
.notes-reader-actions .btn-sm{padding:6px 10px;font-size:12px;}
|
|
|
|
/* Stack the editor action row on small screens so nothing wraps weird */
|
|
.notes-editor-head{flex-wrap:wrap;}
|
|
.notes-title-input{font-size:17px;min-width:140px;flex:1 1 100%;order:2;}
|
|
.notes-back{order:1;}
|
|
.notes-editor-actions{order:3;flex-wrap:wrap;gap:6px;width:100%;justify-content:flex-start;}
|
|
|
|
.notes-voice-bar{flex-wrap:wrap;}
|
|
.notes-empty-state{padding:40px 16px;}
|
|
}
|
|
|
|
/* Desktop: the list pane should never be hidden by data-view toggles */
|
|
@media (min-width:901px){
|
|
.notes-layout[data-view] .notes-sidebar{display:flex !important;}
|
|
}
|
|
|
|
/* ── Notes: trash + tabs ──────────────────────────────────────── */
|
|
.notes-tabs{display:flex;gap:4px;margin-top:6px;}
|
|
.notes-tab-btn{flex:1;padding:6px 10px;background:transparent;border:1px solid var(--g300);border-radius:6px;font-size:12px;font-weight:500;color:var(--g600);cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;justify-content:center;gap:4px;transition:background 0.1s;}
|
|
.notes-tab-btn:hover{background:var(--g100);}
|
|
.notes-tab-btn.active{background:var(--blue-light);color:var(--blue);border-color:var(--blue);}
|
|
.notes-trash-count{font-size:11px;color:var(--g500);margin-left:2px;}
|
|
.notes-tab-btn.active .notes-trash-count{color:var(--blue);}
|
|
|
|
.notes-trash-foot{padding:8px 10px;border-top:1px solid var(--g200);background:var(--g50);}
|
|
.notes-trash-foot.hidden{display:none;}
|
|
.notes-trash-foot .btn-sm{width:100%;justify-content:center;}
|
|
|
|
.notes-list-row{position:relative;display:flex;align-items:stretch;gap:0;}
|
|
.notes-list-row .notes-list-item{flex:1;min-width:0;}
|
|
.notes-trash-actions{display:flex;flex-direction:column;gap:4px;padding:6px 6px 6px 0;align-items:stretch;}
|
|
.notes-restore-btn,.notes-hard-delete-btn{font-size:11px;font-weight:500;padding:4px 8px;border:1px solid var(--g300);border-radius:6px;background:white;color:var(--g700);cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;gap:4px;}
|
|
.notes-restore-btn:hover{background:var(--blue-light);color:var(--blue);border-color:var(--blue);}
|
|
.notes-hard-delete-btn{padding:4px 6px;color:var(--red);border-color:var(--red-light);}
|
|
.notes-hard-delete-btn:hover{background:var(--red);color:white;border-color:var(--red);}
|
|
|
|
/* In trash view, list items aren't clickable as drafts — make that visible */
|
|
.notes-list[data-pane="trash"] .notes-list-item{cursor:default;opacity:0.85;}
|
|
|
|
/* ─── Extensions / Pagers cards ─────────────────────────────────────── */
|
|
/* Entrance: gentle fade-up. Stagger via inline --ext-stagger CSS var
|
|
set per-card in renderCard() so cards appear in a wave. */
|
|
@keyframes extCardIn{
|
|
from{opacity:0;transform:translateY(6px);}
|
|
to {opacity:1;transform:translateY(0);}
|
|
}
|
|
.ext-card{
|
|
opacity:0;
|
|
animation:extCardIn .32s cubic-bezier(.2,.8,.2,1) forwards;
|
|
animation-delay:var(--ext-stagger,0ms);
|
|
transition:transform .15s ease, box-shadow .2s ease, border-color .15s ease;
|
|
will-change:transform;
|
|
}
|
|
.ext-card:hover{
|
|
border-color:var(--g300)!important;
|
|
box-shadow:0 4px 12px -2px rgba(0,0,0,.08), 0 2px 4px -1px rgba(0,0,0,.04);
|
|
transform:translateY(-1px);
|
|
}
|
|
|
|
/* Action buttons: dim by default, pop to full opacity on card hover or
|
|
when keyboard focus enters. Keeps the visual weight on the number. */
|
|
.ext-card .ext-action{padding:4px 8px;opacity:.55;transition:opacity .15s ease, background .15s ease;}
|
|
.ext-card:hover .ext-action,
|
|
.ext-card:focus-within .ext-action{opacity:1;}
|
|
.ext-card .ext-action:hover{opacity:1;background:var(--g100);}
|
|
|
|
/* Click-to-copy number: button reset + the copied-flash class. */
|
|
.ext-number{transition:color .2s ease;}
|
|
.ext-number:hover{text-decoration:underline;text-decoration-style:dotted;text-underline-offset:3px;text-decoration-thickness:1px;}
|
|
.ext-number:focus-visible{outline:2px solid currentColor;outline-offset:2px;border-radius:4px;}
|
|
@keyframes extCopyFlash{
|
|
0% {color:#10b981;transform:scale(1.04);}
|
|
100%{color:inherit;transform:scale(1);}
|
|
}
|
|
.ext-number.ext-copied{animation:extCopyFlash .55s ease;}
|
|
.ext-number.ext-copied::after{
|
|
content:" ✓ copied";
|
|
font-size:11px;
|
|
font-weight:600;
|
|
color:#10b981;
|
|
letter-spacing:.5px;
|
|
margin-left:6px;
|
|
animation:extCopyFlash .55s ease;
|
|
}
|
|
|
|
/* Reduced motion — respect the OS preference. Skip the entrance + hover
|
|
transform; keep only color transitions. */
|
|
@media (prefers-reduced-motion:reduce){
|
|
.ext-card{animation:none;opacity:1;}
|
|
.ext-card:hover{transform:none;}
|
|
.ext-number.ext-copied{animation:none;}
|
|
}
|
|
|
|
/* ─── Admin Docs viewer ─────────────────────────────────────────────── */
|
|
.docs-shell{display:flex;gap:14px;height:calc(100vh - 200px);min-height:500px;}
|
|
.docs-sidebar{flex:0 0 280px;display:flex;flex-direction:column;background:var(--g50);border:1px solid var(--g200);border-radius:10px;overflow:hidden;}
|
|
.docs-sidebar-head{padding:10px;border-bottom:1px solid var(--g200);background:white;}
|
|
.docs-filter{width:100%;padding:6px 10px;border:1px solid var(--g300);border-radius:6px;font-size:13px;font-family:inherit;}
|
|
.docs-filter:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 2px var(--blue-light);}
|
|
.docs-tree{flex:1;overflow-y:auto;padding:6px 4px;font-size:13px;}
|
|
.docs-loading,.docs-empty{padding:20px;text-align:center;color:var(--g500);font-size:12px;}
|
|
.docs-node{margin:1px 0;}
|
|
.docs-dir>.docs-children{margin-left:14px;border-left:1px dashed var(--g200);padding-left:4px;}
|
|
.docs-dir-toggle,.docs-file-btn{display:flex;align-items:center;gap:6px;width:100%;padding:5px 8px;background:none;border:0;border-radius:6px;font-family:inherit;font-size:13px;color:var(--g700);cursor:pointer;text-align:left;transition:background .12s ease, color .12s ease;}
|
|
.docs-dir-toggle:hover,.docs-file-btn:hover{background:white;color:var(--g900);}
|
|
.docs-file-btn.active{background:var(--blue-light);color:var(--blue-dark);font-weight:600;}
|
|
.docs-icon{font-size:11px;color:var(--g500);width:14px;text-align:center;flex-shrink:0;}
|
|
.docs-file-btn.active .docs-icon{color:var(--blue);}
|
|
.docs-arrow{font-size:9px;color:var(--g400);width:10px;text-align:center;flex-shrink:0;transition:transform .12s ease;}
|
|
.docs-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
|
|
.docs-file-parent{font-size:10px;color:var(--g400);margin-left:6px;}
|
|
.docs-reader{flex:1;min-width:0;background:white;border:1px solid var(--g200);border-radius:10px;overflow-y:auto;display:flex;flex-direction:column;}
|
|
.docs-reader-meta{padding:8px 18px;border-bottom:1px solid var(--g100);background:var(--g50);font-size:11px;color:var(--g500);font-family:ui-monospace,SFMono-Regular,monospace;}
|
|
.docs-reader-body{flex:1;padding:24px 32px;line-height:1.7;color:var(--g800);font-size:14px;overflow-x:hidden;}
|
|
.docs-reader-body h1,.docs-reader-body h2,.docs-reader-body h3,.docs-reader-body h4{color:var(--g900);font-weight:700;margin:1.4em 0 .6em;line-height:1.3;}
|
|
.docs-reader-body h1{font-size:24px;border-bottom:1px solid var(--g200);padding-bottom:8px;}
|
|
.docs-reader-body h2{font-size:20px;}
|
|
.docs-reader-body h3{font-size:17px;}
|
|
.docs-reader-body h4{font-size:15px;color:var(--g700);}
|
|
.docs-reader-body p{margin:0 0 1em;}
|
|
.docs-reader-body ul,.docs-reader-body ol{margin:0 0 1em;padding-left:1.6em;}
|
|
.docs-reader-body li{margin:.25em 0;}
|
|
.docs-reader-body code{background:var(--g100);padding:1px 5px;border-radius:4px;font-size:.88em;font-family:ui-monospace,SFMono-Regular,monospace;color:#be185d;}
|
|
.docs-reader-body pre{background:#0f172a;color:#e2e8f0;padding:14px 16px;border-radius:8px;overflow-x:auto;margin:0 0 1em;font-size:12px;line-height:1.55;}
|
|
.docs-reader-body pre code{background:none;padding:0;color:inherit;font-size:inherit;}
|
|
.docs-reader-body blockquote{border-left:3px solid var(--blue);background:var(--blue-light);padding:8px 14px;margin:0 0 1em;border-radius:0 6px 6px 0;color:var(--g700);}
|
|
.docs-reader-body blockquote p:last-child{margin-bottom:0;}
|
|
.docs-reader-body table{border-collapse:collapse;margin:0 0 1em;font-size:13px;display:block;overflow-x:auto;}
|
|
.docs-reader-body th,.docs-reader-body td{border:1px solid var(--g200);padding:6px 10px;text-align:left;}
|
|
.docs-reader-body th{background:var(--g50);font-weight:600;}
|
|
.docs-reader-body a{color:var(--blue);text-decoration:none;}
|
|
.docs-reader-body a:hover{text-decoration:underline;}
|
|
.docs-reader-body .docs-anchor-link{color:var(--blue);cursor:pointer;text-decoration:none;}
|
|
.docs-reader-body .docs-anchor-link:hover{text-decoration:underline;}
|
|
.docs-reader-body hr{border:0;border-top:1px solid var(--g200);margin:1.6em 0;}
|
|
|
|
@media (max-width:900px){
|
|
.docs-shell{flex-direction:column;height:auto;}
|
|
.docs-sidebar{flex:0 0 auto;max-height:240px;}
|
|
.docs-reader{min-height:60vh;}
|
|
}
|
|
|
|
/* Biometric login button on the auth screen — themed to match the SSO
|
|
button in restraint, but with a friendly accent so it doesn't look
|
|
like a duplicate of the password Sign In button. */
|
|
.btn-bio-login{
|
|
background:linear-gradient(135deg,#0ea5e9,#2563eb);
|
|
color:white;
|
|
margin-bottom:8px;
|
|
display:flex;align-items:center;justify-content:center;gap:8px;
|
|
transition:transform .12s ease, box-shadow .15s ease;
|
|
}
|
|
.btn-bio-login:hover{transform:translateY(-1px);box-shadow:0 4px 12px -3px rgba(37,99,235,.45);}
|
|
.btn-bio-login:active{transform:translateY(0);}
|
|
.btn-bio-login i{font-size:18px;}
|
|
|
|
/* Admin settings rows: straight aligned label/control pairs with consistent boxes. */
|
|
.admin-row { display:grid; grid-template-columns:minmax(140px,200px) minmax(0,1fr) auto; gap:10px; align-items:center; }
|
|
.admin-row-label { font-size:13px; font-weight:600; color:var(--g700); text-align:right; }
|
|
.admin-control { width:100%; font-size:13px; font-family:inherit; padding:6px 10px; border:1px solid var(--g300); border-radius:6px; max-width:420px; background:white; color:var(--g800); }
|
|
.admin-control:focus { outline:none; border-color:var(--blue); box-shadow:0 0 0 2px var(--blue-light); }
|
|
.cms-prompt-family > label { display:grid; grid-template-columns:minmax(140px,200px) minmax(0,1fr); gap:10px; align-items:center; }
|
|
@media (max-width:640px) {
|
|
.admin-row { grid-template-columns:1fr; }
|
|
.admin-row-label { text-align:left; }
|
|
.admin-control { max-width:none; }
|
|
.cms-prompt-family > label { grid-template-columns:1fr; }
|
|
}
|
|
|
|
/* One consistent font across the whole Admin panel. */
|
|
#admin-tab select, #admin-tab input, #admin-tab textarea, #admin-tab button,
|
|
#admin-tab .cms-prompt-family select, #admin-tab .cms-prompt-family textarea {
|
|
font-family: inherit;
|
|
}
|
|
|
|
/* Open WebUI-style assistant workspace: saved chats replace the main menu */
|
|
/* The blue app header stays: it is the same product, and hiding it was the last
|
|
thing making the assistant look like a separate one. Only the app SIDEBAR goes,
|
|
because the assistant rail takes its place. */
|
|
body.assistant-workspace .sidebar,
|
|
body.assistant-workspace .announcement-banner { display:none; }
|
|
body.assistant-workspace .app-body { min-height:100vh; }
|
|
body.assistant-workspace #assistant-tab.active { width:100%; }
|
|
/* iOS: taps on controls must not trigger double-tap zoom */
|
|
button, a, .btn-sm, .btn-generate, .btn-send, .tab-btn, input, textarea, select, label { touch-action: manipulation; }
|
|
|
|
/* ── Shared app chrome: the Assistant/Workspace switch and the menu toggle ────
|
|
These render in BOTH the app sidebar and the assistant rail. They used to live
|
|
in assistant.css, which only the assistant component loads — so on the main
|
|
app page they rendered as unstyled native buttons. */
|
|
/* ── Assistant / Workspace switch ────────────────────────────────────────────
|
|
Rendered identically in the app sidebar and the assistant rail, so moving
|
|
between them changes which pill is highlighted and nothing else. */
|
|
/* The sidebar is 210px wide. Without min-width:0 the buttons refuse to shrink
|
|
below their content and the switch overflows its own box. */
|
|
.assistant-mode-switch { display:grid; grid-template-columns:1fr 1fr; gap:4px; margin:8px 12px 10px; padding:4px; background:var(--g100); border:1px solid var(--g200); border-radius:10px; box-sizing:border-box; max-width:calc(100% - 24px); }
|
|
.assistant-mode-switch button { display:flex; align-items:center; justify-content:center; gap:5px; min-width:0; border:0; border-radius:7px; padding:7px 4px; font-family:inherit; font-size:11.5px; font-weight:600; color:var(--g600); background:transparent; cursor:pointer; white-space:nowrap; overflow:hidden; }
|
|
.assistant-mode-switch button i { font-size:11px; flex:0 0 auto; }
|
|
.assistant-mode-switch button:hover { color:var(--g900); }
|
|
.assistant-mode-switch button.active { background:white; color:var(--blue); box-shadow:var(--shadow); }
|
|
/* Inside the assistant rail the gutters already exist, so it only needs the gap. */
|
|
.assistant-history .assistant-mode-switch { margin:0 0 8px; }
|
|
|
|
/* The one menu toggle, identical in the app sidebar and the assistant rail. */
|
|
/* The toggle sits in the head row, so .menu-icon-btn styles it; this class is
|
|
only the behavioural hook that flips the icon. Styling it here too gave it a
|
|
second size and margin that fought the row. */
|
|
.assistant-menu-toggle i { transition:transform .15s ease; }
|
|
.assistant-menu-toggle.is-collapsed i { transform:rotate(180deg); }
|
|
|
|
/* Hidden menu: the rail collapses in both places, and the layout takes the
|
|
space back rather than leaving a gutter. */
|
|
/* Collapsing must not take the control away with it, or there is no way back.
|
|
The toggle leaves the collapsing box and pins itself beside the content. */
|
|
/* Collapsed = a narrow icon rail, not a disappearance. The brand mark, the
|
|
toggle, search and the account avatar stay reachable, so nothing has to be
|
|
floated over the content and there is always a way back. */
|
|
body.menu-hidden .sidebar { width:52px; }
|
|
body.menu-hidden .sidebar-tabs,
|
|
body.menu-hidden .assistant-mode-switch,
|
|
body.menu-hidden .sidebar-section-label,
|
|
body.menu-hidden .menu-brand h1,
|
|
body.menu-hidden .account-id,
|
|
body.menu-hidden .account-chevron { display:none; }
|
|
body.menu-hidden .menu-head { flex-direction:column; gap:6px; padding:10px 0 8px; align-items:center; }
|
|
body.menu-hidden .menu-brand { flex:0 0 auto; justify-content:center; }
|
|
body.menu-hidden .menu-brand i { font-size:19px; }
|
|
body.menu-hidden .account-card { padding:8px 0; }
|
|
body.menu-hidden .account-card-btn { justify-content:center; padding:6px 0; }
|
|
body.menu-hidden .account-menu { left:8px; right:auto; width:210px; }
|
|
|
|
/* The assistant rail collapses to the same strip rather than to nothing. */
|
|
body.assistant-workspace.menu-hidden .assistant-layout { grid-template-columns:52px minmax(0,1fr) 330px; }
|
|
body.assistant-workspace.menu-hidden.assistant-no-citations .assistant-layout,
|
|
body.assistant-mode-workspace.menu-hidden .assistant-layout { grid-template-columns:52px minmax(0,1fr); }
|
|
body.assistant-workspace.menu-hidden .assistant-history { width:auto; min-width:0; overflow:visible; padding:0; }
|
|
body.assistant-workspace.menu-hidden .assistant-history .card,
|
|
body.assistant-workspace.menu-hidden .assistant-rail-workspace,
|
|
body.assistant-workspace.menu-hidden .assistant-rail-actions,
|
|
body.assistant-workspace.menu-hidden .assistant-mode-switch { display:none; }
|
|
|
|
@media (max-width:640px) { .assistant-menu-toggle { display:none; } body.menu-hidden .sidebar { width:auto; } }
|
|
|
|
/* Signed-out preview: the assistant is usable, everything that needs an account
|
|
is not shown rather than shown and refused. */
|
|
body.assistant-preview .assistant-plus,
|
|
body.assistant-preview .assistant-history .card,
|
|
body.assistant-preview .assistant-rail-actions,
|
|
body.assistant-preview .assistant-chats-header { display:none !important; }
|
|
body.assistant-preview .assistant-preview-note { display:flex; }
|
|
.assistant-preview-note { display:none; align-items:center; gap:8px; margin:0 0 10px; padding:8px 12px; border:1px solid var(--blue-light); background:var(--blue-light); color:var(--blue); border-radius:10px; font-size:12px; }
|
|
|
|
/* ── Account card ────────────────────────────────────────────────────────────
|
|
Ends both menus identically. Settings, FAQ, Admin and Log out were unlabelled
|
|
icon buttons in the old header; the slim bar has no room to explain them. */
|
|
.sidebar-nav { padding-bottom:0; }
|
|
.account-card { position:relative; margin-top:auto; border-top:1px solid var(--g200); padding:8px; }
|
|
.account-card-btn { display:flex; align-items:center; gap:9px; width:100%; padding:7px 8px; border:none; border-radius:10px; background:none; cursor:pointer; text-align:left; font-family:inherit; }
|
|
.account-card-btn:hover, .account-card-btn[aria-expanded="true"] { background:var(--g100); }
|
|
.account-avatar { flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px; border-radius:999px; background:var(--blue); color:white; font-size:11px; font-weight:700; letter-spacing:.02em; }
|
|
.account-id { flex:1 1 auto; min-width:0; display:flex; flex-direction:column; }
|
|
.account-name { font-size:12.5px; font-weight:600; color:var(--g800); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
|
|
.account-email { font-size:11px; color:var(--g500); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
|
|
.account-chevron { flex:0 0 auto; font-size:10px; color:var(--g400); }
|
|
.account-menu { position:absolute; bottom:calc(100% - 4px); left:8px; right:8px; z-index:130; display:flex; flex-direction:column; gap:2px; padding:6px; background:white; border:1px solid var(--g200); border-radius:12px; box-shadow:0 12px 32px rgba(15,23,42,.16); }
|
|
.account-menu[hidden] { display:none; }
|
|
.account-menu-item { display:flex; align-items:center; gap:10px; width:100%; border:0; border-radius:8px; padding:8px 10px; background:none; color:var(--g700); font-family:inherit; font-size:13px; text-align:left; cursor:pointer; }
|
|
.account-menu-item:hover { background:var(--blue-light); color:var(--blue); }
|
|
.account-menu-item i { width:16px; text-align:center; color:var(--g400); font-size:12px; }
|
|
.account-menu-item:hover i { color:var(--blue); }
|
|
/* The rail is a flex column, so the card needs the same push to the bottom. */
|
|
.assistant-history .account-card { margin-top:auto; padding:8px 0 0; }
|
|
/* Collapsed menus hide their contents; the card goes with them. */
|
|
/* A preview visitor has no account to show. */
|
|
body.assistant-preview .account-card { display:none; }
|
|
|
|
/* ── Search palette ──────────────────────────────────────────────────────────
|
|
One component in both views; the view decides what it searches. */
|
|
|
|
.menu-search { position:fixed; inset:0; z-index:200; background:rgba(15,23,42,.45); display:flex; align-items:flex-start; justify-content:center; padding:12vh 16px 16px; }
|
|
.menu-search[hidden] { display:none; }
|
|
.menu-search-panel { width:min(640px,100%); max-height:70vh; display:flex; flex-direction:column; background:white; border:1px solid var(--g200); border-radius:14px; box-shadow:0 24px 60px rgba(15,23,42,.28); overflow:hidden; }
|
|
.menu-search-head { display:flex; align-items:center; gap:10px; padding:12px 14px; border-bottom:1px solid var(--g100); }
|
|
.menu-search-head i { color:var(--g400); font-size:13px; }
|
|
.menu-search-head input { flex:1 1 auto; min-width:0; border:none; outline:none; background:none; font-family:inherit; font-size:15px; color:var(--g900); }
|
|
.menu-search-head button { border:none; background:none; color:var(--g400); font-size:14px; cursor:pointer; padding:4px; }
|
|
.menu-search-head button:hover { color:var(--g700); }
|
|
.menu-search-results { flex:1 1 auto; min-height:0; overflow-y:auto; padding:6px; display:flex; flex-direction:column; gap:2px; }
|
|
.menu-search-item { display:flex; align-items:center; gap:10px; width:100%; border:none; border-radius:9px; padding:9px 10px; background:none; color:var(--g800); font-family:inherit; font-size:13px; text-align:left; cursor:pointer; }
|
|
.menu-search-item i { width:16px; text-align:center; color:var(--g400); font-size:12px; flex:0 0 auto; }
|
|
.menu-search-item span { flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
|
|
.menu-search-item em { flex:0 0 auto; font-style:normal; font-size:11px; color:var(--g400); }
|
|
.menu-search-item:hover, .menu-search-item.is-active { background:var(--blue-light); color:var(--blue); }
|
|
.menu-search-item:hover i, .menu-search-item.is-active i { color:var(--blue); }
|
|
.menu-search-empty { margin:0; padding:18px 12px; text-align:center; font-size:13px; color:var(--g400); }
|
|
/* Collapsed: only the toggle survives, so there is a way back. */
|