/* Diário de Pressão HF12 — reconstrução responsiva desktop + padronização de componentes
   Mantém a identidade Vinho e Ivory existente. Sem alteração clínica, de schema ou Sync. */
:root{
  --dl-desktop-sidebar:236px;
  --dl-desktop-max:1680px;
  --dl-font-xs:.72rem;
  --dl-font-sm:.80rem;
  --dl-font-md:.90rem;
  --dl-font-lg:1.05rem;
  --dl-font-xl:1.34rem;
  --dl-control-h:42px;
  --dl-row-h:44px;
  --dl-radius:14px;
}

/* Contrato de contraste: superfícies claras usam texto escuro; superfícies escuras, texto claro. */
html[data-theme="light"] body{
  --dl-surface-text:#31111d;
  --dl-surface-muted:#a1385f;
  --dl-dark-text:#FAF6ED;
}
html[data-theme="dark"] body{
  --dl-surface-text:#FAF6ED;
  --dl-surface-muted:#dda0b6;
  --dl-dark-text:#FAF6ED;
}
html[data-theme="light"] body :where(.card,.feature-card,.analytics-panel,.study-info,.system-card,.report-card,.analysis-section,.weekly-panel,.settings-panel,.history-panel,.sync-card,.notification-item,.native-sheet,.native-sheet-card,.pressure-guide-modal,.medication-question-card,.timeline-row,.pattern-lens-panel){
  color:#17212B!important;
}
html[data-theme="light"] body :where(.card,.feature-card,.analytics-panel,.study-info,.system-card,.report-card,.analysis-section,.weekly-panel,.settings-panel,.history-panel,.sync-card,.notification-item,.native-sheet,.native-sheet-card,.pressure-guide-modal,.medication-question-card,.timeline-row,.pattern-lens-panel) :where(h1,h2,h3,h4,h5,h6,strong,label){
  color:#17212B;
}
html[data-theme="dark"] body :where(.card,.feature-card,.analytics-panel,.study-info,.system-card,.report-card,.analysis-section,.weekly-panel,.settings-panel,.history-panel,.sync-card,.notification-item,.native-sheet,.native-sheet-card,.pressure-guide-modal,.medication-question-card,.timeline-row,.pattern-lens-panel){
  color:#EEF4F6!important;
}
html[data-theme="dark"] body :where(.card,.feature-card,.analytics-panel,.study-info,.system-card,.report-card,.analysis-section,.weekly-panel,.settings-panel,.history-panel,.sync-card,.notification-item,.native-sheet,.native-sheet-card,.pressure-guide-modal,.medication-question-card,.timeline-row,.pattern-lens-panel) :where(h1,h2,h3,h4,h5,h6,strong,label){
  color:#EEF4F6;
}
.app-header,.bottom-nav,.dl-desktop-sidebar{
  color:#FAF6ED!important;
}
.app-header :where(h1,h2,h3,h4,h5,h6,strong,span,small,p,label,a,button),
.bottom-nav :where(strong,span,small,p,label,a,button),
.dl-desktop-sidebar :where(h1,h2,h3,h4,h5,h6,strong,span,small,p,label,a,button){
  color:#FAF6ED!important;
}

/* Padronização global de componentes sem trocar tema. */
.app-scroll-region :where(.card,.feature-card,.analytics-panel,.system-card,.report-card,.analysis-section,.weekly-panel,.settings-panel,.history-panel,.sync-card,.pattern-lens-panel){
  border-radius:var(--dl-radius)!important;
}
.app-scroll-region :where(h1){font-size:clamp(1.45rem,1.1rem + .7vw,2rem)!important;line-height:1.12!important}
.app-scroll-region :where(h2){font-size:var(--dl-font-xl)!important;line-height:1.18!important}
.app-scroll-region :where(h3){font-size:var(--dl-font-lg)!important;line-height:1.22!important}
.app-scroll-region :where(p,li,td,.section-sub,.mini-note,.note,.helper,.description){font-size:var(--dl-font-sm);line-height:1.5}
.app-scroll-region :where(.field label,label.field-label){font-size:var(--dl-font-sm)!important;font-weight:750!important;line-height:1.25!important}
.app-scroll-region :where(input:not([type="checkbox"]):not([type="radio"]),select,textarea){
  min-height:var(--dl-control-h)!important;
  font-size:var(--dl-font-md)!important;
  padding:.58rem .72rem!important;
}
.app-scroll-region :where(button,.btn){
  min-height:var(--dl-control-h)!important;
  font-size:var(--dl-font-sm)!important;
  line-height:1.2!important;
  font-weight:780!important;
  padding:.62rem .82rem!important;
}
.app-scroll-region :where(.vtag,.lab-env-badge,.optional-badge,.notification-permission-pill,.pattern-engine-badge,.sync-assist-chip,.status-pill,.pill,.tag-chip){
  min-height:26px!important;
  padding:4px 9px!important;
  border-radius:999px!important;
  font-size:var(--dl-font-xs)!important;
  line-height:1.1!important;
  font-weight:800!important;
  letter-spacing:.015em!important;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  white-space:nowrap;
}
.app-scroll-region :where(.section-hub-button,.settings-hub-button){
  padding:14px!important;
  gap:12px!important;
  min-height:92px!important;
}
.app-scroll-region :where(.section-hub-button,.settings-hub-button) strong{font-size:var(--dl-font-md)!important;line-height:1.2!important}
.app-scroll-region :where(.section-hub-button,.settings-hub-button) span span{font-size:var(--dl-font-sm)!important;line-height:1.38!important}
.app-scroll-region :where(.recent-mini-item,.timeline-row,.agenda-item,.care-row,.notification-item,.medication-row,.profile-summary-item){
  min-height:var(--dl-row-h);
}

/* Tabelas: estrutura literal de linhas/colunas no desktop. */
.app-scroll-region :where(.table-wrap,.trend-table-wrap){overflow:auto!important}
.app-scroll-region table{border-collapse:separate!important;border-spacing:0!important;width:100%!important}
.app-scroll-region table :where(th,td){
  padding:10px 12px!important;
  font-size:var(--dl-font-sm)!important;
  line-height:1.35!important;
  vertical-align:middle!important;
  border-right:1px solid var(--ods-border-soft)!important;
  border-bottom:1px solid var(--ods-border-soft)!important;
}
.app-scroll-region table :where(th:first-child,td:first-child){border-left:1px solid var(--ods-border-soft)!important}
.app-scroll-region table thead th{
  position:sticky;
  top:0;
  z-index:2;
  font-size:var(--dl-font-xs)!important;
  text-transform:uppercase;
  letter-spacing:.045em;
  font-weight:850!important;
  white-space:nowrap;
  border-top:1px solid var(--ods-border-soft)!important;
}
.app-scroll-region table thead th:first-child{border-top-left-radius:10px}
.app-scroll-region table thead th:last-child{border-top-right-radius:10px}
html[data-theme="light"] .app-scroll-region table tbody td{background:#FFFCF5!important;color:#31111d!important}
html[data-theme="light"] .app-scroll-region table tbody tr:nth-child(even) td{background:#FAF6ED!important}
html[data-theme="dark"] .app-scroll-region table tbody td{background:#33121e!important;color:#FAF6ED!important}
html[data-theme="dark"] .app-scroll-region table tbody tr:nth-child(even) td{background:#290e18!important}

/* Mobile preservado: apenas equalização de componentes, sem shell desktop. */
@media(max-width:1023px){
  .dl-desktop-sidebar{display:none!important}
  .app-scroll-region :where(.card,.feature-card,.analytics-panel,.system-card,.report-card,.analysis-section,.weekly-panel,.settings-panel,.history-panel,.sync-card,.pattern-lens-panel){padding-left:14px!important;padding-right:14px!important}
  .app-scroll-region table :where(th,td){font-size:.76rem!important;padding:9px 8px!important}
}

/* Desktop workspace real. */
@media(min-width:1024px){
  :root{--dp-gutter:24px!important;--dp-shell-max:1680px!important}
  html,body{overflow:hidden!important}
  .app-shell-frame{
    width:100vw!important;
    max-width:100vw!important;
    height:100dvh!important;
    display:grid!important;
    grid-template-columns:var(--dl-desktop-sidebar) minmax(0,1fr)!important;
    grid-template-rows:auto minmax(0,1fr)!important;
    background:var(--ods-bg)!important;
  }
  .dl-desktop-sidebar{
    grid-column:1!important;
    grid-row:1 / 3!important;
    min-width:0;
    overflow-y:auto;
    padding:18px 14px 16px;
    background:linear-gradient(180deg,#541B32 0%,#3a1522 58%,#541B32 100%)!important;
    border-right:1px solid rgba(248,236,240,.12);
    display:flex;
    flex-direction:column;
    gap:14px;
  }
  .dl-desktop-brand{display:flex;align-items:center;gap:10px;padding:4px 6px 12px;border-bottom:1px solid rgba(248,236,240,.13)}
  .dl-desktop-brand-mark{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:#963C5C;color:#FAF6ED;font-size:18px;font-weight:900;box-shadow:0 8px 20px rgba(0,0,0,.16)}
  .dl-desktop-brand-copy{min-width:0}.dl-desktop-brand-copy strong{display:block;font-size:.95rem;line-height:1.1}.dl-desktop-brand-copy span{display:block;margin-top:3px;font-size:.68rem;color:#e6b6c8!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .dl-desktop-nav{display:grid;gap:5px}
  .dl-desktop-nav button{width:100%;min-height:44px!important;display:grid!important;grid-template-columns:34px minmax(0,1fr);align-items:center;gap:9px;padding:6px 9px!important;background:transparent!important;border:1px solid transparent!important;border-radius:11px!important;text-align:left!important;box-shadow:none!important}
  .dl-desktop-nav button .dl-nav-icon{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;background:rgba(248,236,240,.07);color:#FAF6ED!important}
  .dl-desktop-nav button svg{width:20px!important;height:20px!important;stroke:currentColor}
  .dl-desktop-nav button .dl-nav-copy{display:block;min-width:0;font-size:.79rem;font-weight:760;color:#f0d5df!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .dl-desktop-nav button:hover{background:rgba(248,236,240,.08)!important;border-color:rgba(248,236,240,.08)!important}
  .dl-desktop-nav button.active{background:#FAF6ED!important;border-color:#FAF6ED!important}
  .dl-desktop-nav button.active .dl-nav-copy{color:#541B32!important}
  .dl-desktop-nav button.active .dl-nav-icon{background:linear-gradient(145deg,#963C5C,#782C47)!important;color:#FAF6ED!important}
  .dl-desktop-divider{height:1px;background:rgba(248,236,240,.12);margin:2px 5px}
  .dl-desktop-context{padding:12px 8px 4px;margin-top:auto;border-top:1px solid rgba(248,236,240,.13)}
  .dl-desktop-context strong{display:block;font-size:.75rem}.dl-desktop-context span{display:block;margin-top:3px;font-size:.66rem;color:#dda0b6!important;line-height:1.35}

  .app-header{grid-column:2!important;grid-row:1!important;min-width:0!important}
  .app-header-inner{width:100%!important;max-width:none!important;padding-left:22px!important;padding-right:22px!important;min-height:64px!important}
  .app-header .brand-lockup{gap:9px!important}
  .app-header .brand-text strong{font-size:.88rem!important}.app-header .brand-text span{font-size:.67rem!important}
  .app-header .header-page{font-size:.72rem!important}
  .app-header .theme-toggle{min-height:38px!important;width:38px!important;padding:0!important}

  .app-scroll-region{grid-column:2!important;grid-row:2!important;min-width:0!important;overflow-y:auto!important;overflow-x:hidden!important;background:var(--ods-bg)!important}
  main.app{width:100%!important;max-width:var(--dl-desktop-max)!important;margin:0 auto!important;padding:22px 28px 34px!important}
  .app-footer{width:100%!important;max-width:var(--dl-desktop-max)!important;padding-left:28px!important;padding-right:28px!important}
  .bottom-nav{display:none!important}

  /* Cards e hubs usam o monitor em vez de reproduzir coluna mobile. */
  .app-scroll-region :where(.card,.feature-card,.analytics-panel,.system-card,.report-card,.analysis-section,.weekly-panel,.settings-panel,.history-panel,.sync-card,.pattern-lens-panel){padding:18px!important}
  .section-hub-grid,.settings-hub-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px!important}
  .grid,.analytics-grid{gap:14px!important}
  .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px 14px!important}
  .inline-grid{gap:10px!important}
  .actions{gap:8px!important;align-items:center!important;flex-wrap:wrap!important}

  /* Home vira painel horizontal mais confortável. */
  #inicio .hero-top{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:18px!important;align-items:start!important}
  #home12Command .home12-topline{display:flex!important;justify-content:space-between!important;gap:18px!important}
  #home12Command .home12-lower{display:grid!important;grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr)!important;gap:14px!important}
  #home12Command .home12-explore-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}

  /* Registrar: campos deixam de formar uma coluna comprida. */
  #registrar.entry-card .register-step :where(.form-grid,.grid){grid-template-columns:repeat(2,minmax(0,1fr))!important}
  #registrar.entry-card .reading-grid,#registrar.entry-card .measurement-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}

  /* Relatório cardiologista: configuração à esquerda, prévia à direita. */
  #cardioReportSection{
    display:grid!important;
    grid-template-columns:minmax(300px,360px) minmax(0,1fr)!important;
    grid-template-areas:
      "back back"
      "hero hero"
      "controls preview"
      "options preview"
      "actions preview"
      "note preview"!important;
    gap:12px 18px!important;
    align-items:start!important;
  }
  #cardioReportSection>.section-back{grid-area:back}
  #cardioReportSection>.cardio-report-hero{grid-area:hero;margin-bottom:0!important}
  #cardioReportSection>.cardio-report-controls{grid-area:controls;display:grid!important;grid-template-columns:1fr!important;gap:10px!important}
  #cardioReportSection>.cardio-report-options{grid-area:options;display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;padding:12px!important;border:1px solid var(--ods-border-soft)!important;border-radius:12px!important;background:var(--ods-surface)!important}
  #cardioReportSection>.cardio-report-preview{grid-area:preview;min-height:240px!important;margin:0!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;align-content:start!important}
  #cardioReportSection>.cardio-report-actions{grid-area:actions;display:grid!important;grid-template-columns:1fr!important;gap:8px!important}
  #cardioReportSection>.cardio-report-note{grid-area:note;margin:0!important}
  #cardioReportSection .cardio-preview-card{min-height:92px!important;padding:14px!important}
  #cardioReportSection .cardio-preview-wide{grid-column:1/-1!important}

  /* Detalhes analíticos e configurações com leitura mais larga. */
  .analysis-builder-controls,.pattern-lens-controls,.pattern-compare-controls,.home-device-layout{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .compare-grid,.pattern-compare-grid16,.consult-compare-grid16{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .app-shell-grid,.diagnostic-grid,.quality-grid13,.promotion-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .data-center-actions{display:flex!important;flex-wrap:wrap!important;gap:8px!important}
}

@media(min-width:1380px){
  :root{--dl-desktop-sidebar:248px}
  .section-hub-grid,.settings-hub-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .app-scroll-region :where(h2){font-size:1.42rem!important}
  .app-scroll-region table :where(th,td){padding:11px 13px!important}
}

@media(min-width:1024px) and (max-width:1199px){
  :root{--dl-desktop-sidebar:216px}
  .section-hub-grid,.settings-hub-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  main.app{padding-left:20px!important;padding-right:20px!important}
  #cardioReportSection{grid-template-columns:minmax(275px,330px) minmax(0,1fr)!important}
}