@import url("./assets/fonts/mail-brand.css");
@import url("./visual-identity.css");

:root {
  --tv-font-text: 'Hanken Grotesk', Arial, sans-serif;
  --tv-font-heading: 'Cormorant Garamond', Georgia, serif;
  --tv-type-title: clamp(2.5rem, 2rem + 3vw, 4.75rem);
  --tv-type-section: clamp(1.875rem, 1.5rem + 1.8vw, 3rem);
  --tv-type-card: clamp(1.375rem, 1.2rem + .9vw, 2rem);
  --tv-type-body: 1rem;
  --tv-type-detail: .875rem;
  --tv-type-caption: .8125rem;
  --tv-leading-title: 1.1;
  --tv-leading-heading: 1.2;
  --tv-leading-body: 1.6;
  --tv-leading-detail: 1.4;
}
.tv-workspace {
  --tv-type-title: clamp(2rem, 1.75rem + 1.2vw, 2.75rem);
  --tv-type-section: clamp(1.5rem, 1.35rem + .8vw, 2rem);
  --tv-type-card: clamp(1.25rem, 1.15rem + .5vw, 1.625rem);
}
@media screen {
  body.tv-app { font-family:var(--tv-font-text); font-size:var(--tv-type-body); line-height:var(--tv-leading-body); }
  .tv-app :is(h1,h2,h3,h4,h5,h6) {
    font-family:var(--tv-font-heading) !important;
    font-weight:600 !important;
    line-height:var(--tv-leading-heading) !important;
    overflow-wrap:break-word;
    text-wrap:balance;
  }
  .tv-app h1 { font-size:var(--tv-type-title) !important; line-height:var(--tv-leading-title) !important; }
  .tv-app h2 { font-size:var(--tv-type-section) !important; }
  .tv-app h3 { font-size:var(--tv-type-card) !important; }
  .tv-app :is(h4,h5,h6) { font-size:1.125rem !important; }
  .tv-app p { font-family:var(--tv-font-text); font-size:var(--tv-type-body) !important; line-height:var(--tv-leading-body) !important; }
  .tv-app :is(.note, .muted, #status, #identity, #from, #draft-note, #send-status, #month-grid th) {
    font-size:var(--tv-type-detail) !important; line-height:var(--tv-leading-detail) !important;
  }
  .tv-app :is(.eyebrow,.folio,small) { font-size:var(--tv-type-caption) !important; line-height:var(--tv-leading-detail) !important; }
  .tv-app label { font-family:var(--tv-font-text); line-height:var(--tv-leading-detail); }
  .tv-app #month-grid caption { font:600 var(--tv-type-section)/var(--tv-leading-heading) var(--tv-font-heading); }
}
@media screen {
  .tv-app :is(.tv-table-row, .recent-booking) { font:400 var(--tv-type-detail)/var(--tv-leading-detail) var(--tv-font-text); }
  .tv-app :is(.tv-table-row, .recent-booking) > span { font-size:inherit !important; line-height:var(--tv-leading-detail); }
  .tv-app .tv-table-row:has(+ .tv-table-row):first-child { font-weight:600; }
  .tv-app label > span:first-child:not(.tv-password-field) { font-size:var(--tv-type-detail) !important; line-height:var(--tv-leading-detail); }
  .tv-app .portal-metrics > div > div:first-child { font-size:var(--tv-type-caption) !important; line-height:var(--tv-leading-detail); }
}