/* RentTrack Pro — Compact Visual Refresh v15.14.2
   Capa visual final. No cambia estructura ni comportamiento. */

:root {
  --rt-turquoise: #12BFA6;
  --rt-turquoise-hover: #0EAF98;
  --rt-turquoise-deep: #078D7E;
  --rt-turquoise-light: #54E2CB;
  --rt-turquoise-mist: #E7FAF6;
  --rt-ink: #071A26;
  --rt-ink-secondary: #163040;
  --rt-slate: #405967;
  --rt-muted: #6F828B;
  --rt-background: #F5F8F8;
  --rt-surface: #FFFFFF;
  --rt-surface-soft: #F9FBFB;
  --rt-border: #DFE8E7;
  --rt-pending: #E99B24;
  --rt-pending-soft: #FFF5E4;
  --rt-alert: #D94A4A;
  --rt-alert-soft: #FDECEC;
  --rt-font: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --rt-radius-sm: 8px;
  --rt-radius-md: 12px;
  --rt-radius-lg: 16px;
  --rt-radius-xl: 20px;
  --rt-shadow-card:
    0 1px 2px rgba(7, 26, 38, 0.025),
    0 7px 22px rgba(7, 26, 38, 0.05);
  --rt-shadow-panel:
    0 4px 18px rgba(7, 26, 38, 0.08);
  --rt-motion-fast: 160ms;
  --rt-motion-base: 220ms;
  --rt-motion-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --rt-fixed-nav-height: 66px;
  --bg: var(--rt-background);
  --surface: var(--rt-surface);
  --surface-solid: var(--rt-surface);
  --surface-soft: var(--rt-surface-soft);
  --text: var(--rt-ink);
  --text-soft: var(--rt-ink-secondary);
  --muted: var(--rt-muted);
  --border: var(--rt-border);
  --primary: var(--rt-turquoise);
  --primary-2: var(--rt-turquoise-deep);
  --accent: var(--rt-turquoise-deep);
  --accent-soft: var(--rt-turquoise-mist);
  --success: var(--rt-turquoise-deep);
  --success-bg: var(--rt-turquoise-mist);
  --warning: var(--rt-pending);
  --warning-bg: var(--rt-pending-soft);
  --danger: var(--rt-alert);
  --danger-bg: var(--rt-alert-soft);
  --radius-xl: var(--rt-radius-xl);
  --radius-lg: var(--rt-radius-lg);
  --radius-md: var(--rt-radius-md);
  --radius-sm: var(--rt-radius-sm);
  --shadow-soft: var(--rt-shadow-panel);
  --shadow-card: var(--rt-shadow-card);
  --bottom-nav-height: var(--rt-fixed-nav-height);
  --rt-nav-height: var(--rt-fixed-nav-height);
  --rt-nav-bottom: 0px;
  --rt-nav-width: min(100vw, 760px);
}

html {
  background: var(--rt-background) !important;
  font-size: 15px;
}

body {
  min-height: 100dvh;
  background: var(--rt-background) !important;
  color: var(--rt-ink);
  font-family: var(--rt-font);
  font-feature-settings: "tnum" 1, "ss01" 1, "cv05" 1;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body::before,
.app-shell::before {
  display: none !important;
}

.app-shell {
  width: min(100%, 760px);
  min-height: 100dvh;
  padding-right: clamp(12px, 3.5vw, 18px) !important;
  padding-bottom:
    calc(
      var(--rt-fixed-nav-height) +
      env(safe-area-inset-bottom) +
      18px
    ) !important;
  padding-left: clamp(12px, 3.5vw, 18px) !important;
  background: transparent;
}

/* Cabecera compacta, transparente y sin bloque publicitario */
.app-header {
  position: relative !important;
  top: auto !important;
  z-index: 10;
  min-height: 0;
  align-items: center !important;
  gap: 10px !important;
  padding:
    max(10px, env(safe-area-inset-top))
    0
    9px !important;
  background: transparent !important;
  border-bottom: 1px solid rgba(223, 232, 231, 0.9) !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
}

.app-header > div:first-child {
  min-width: 0;
}

.app-header .rt-brand-lockup,
.app-header .brand-row {
  max-width: 100%;
  margin: 0 0 2px !important;
}

.app-header .rt-brand-logo {
  display: block;
  width: clamp(142px, 34vw, 178px) !important;
  max-width: 100%;
  height: auto;
  background: transparent !important;
  object-fit: contain;
  object-position: left center;
}

.app-header .brand-dot {
  width: 7px;
  height: 7px;
  box-shadow: none;
  background: var(--rt-turquoise);
}

.app-header .eyebrow {
  color: var(--rt-ink);
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: none;
}

.app-header h1 {
  margin: 0 !important;
  color: var(--rt-slate) !important;
  font-size: clamp(0.72rem, 2.1vw, 0.82rem) !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.01em !important;
}

.app-header .status-pill,
.app-header .header-badge {
  min-height: 30px;
  padding: 5px 10px !important;
  border: 1px solid rgba(18, 191, 166, 0.22) !important;
  border-radius: 999px;
  background: rgba(231, 250, 246, 0.84) !important;
  color: var(--rt-turquoise-deep) !important;
  font-size: 0.69rem !important;
  font-weight: 650 !important;
  box-shadow: none !important;
}

/* Jerarquía y densidad */
#view-root,
.screen {
  min-width: 0;
}

.screen {
  gap: 14px !important;
  padding-top: 14px;
  animation: rt-screen-in var(--rt-motion-base) var(--rt-motion-ease) both !important;
}

.personal-page-heading,
.screen-header,
.compact-header {
  gap: 4px !important;
  margin: 0 !important;
  padding: 0 2px !important;
}

.personal-page-heading > div:first-child > span,
.screen-header > span {
  color: var(--rt-muted) !important;
  font-size: 0.68rem !important;
  font-weight: 650 !important;
  letter-spacing: 0.1em !important;
}

.personal-page-heading h2,
.screen-header h2,
.compact-header h2 {
  margin: 2px 0 0 !important;
  font-size: clamp(1.75rem, 7vw, 2.25rem) !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: -0.055em !important;
}

.screen-header p,
.compact-header p,
.personal-section-heading p,
.section-title-row p {
  color: var(--rt-muted) !important;
  font-size: 0.86rem !important;
  line-height: 1.42 !important;
}

.sync-chip {
  min-height: 31px !important;
  padding: 5px 10px !important;
  border: 1px solid rgba(18, 191, 166, 0.22) !important;
  border-radius: 999px !important;
  background: var(--rt-turquoise-mist) !important;
  color: var(--rt-turquoise-deep) !important;
  font-size: 0.7rem !important;
  font-weight: 650 !important;
  box-shadow: none !important;
}

.sync-chip i {
  width: 7px !important;
  height: 7px !important;
  background: var(--rt-turquoise) !important;
  box-shadow: none !important;
}

/* Superficies compartidas: menos cajas, menos sombra, menor tamaño */
.card,
.personal-section-card,
.settings-panel,
.settings-inner-card,
.concept-accordion,
.objective-settings-item,
.calendar-professional-disclosure,
.today-sales-disclosure,
.history-filter-card,
.day-plan-card,
.day-close-summary-card,
.day-sales-card,
.charts-objectives-card,
.dashboard-objectives-disclosure {
  border-color: var(--rt-border) !important;
  background: var(--rt-surface) !important;
  box-shadow: var(--rt-shadow-card) !important;
}

.card,
.personal-section-card {
  padding: 15px !important;
  border-radius: var(--rt-radius-lg) !important;
}

.card:hover,
.personal-section-card:hover,
.metric-card:hover {
  transform: none !important;
  border-color: var(--rt-border) !important;
  box-shadow: var(--rt-shadow-card) !important;
}

.card h3,
.personal-section-heading h3,
.section-title-row h3 {
  margin: 0 !important;
  color: var(--rt-ink) !important;
  font-size: 1rem !important;
  font-weight: 680 !important;
  letter-spacing: -0.025em !important;
}

.personal-section-heading,
.section-title-row {
  gap: 4px !important;
  margin-bottom: 1px !important;
}

.form-grid,
.list,
.objectives-settings-list,
.dashboard-objective-list,
.charts-objective-grid,
.editor-components-list {
  gap: 11px !important;
}

.grid-2,
.action-row,
.history-filter-grid,
.closure-summary-grid,
.calendar-month-metrics,
.day-metric-grid {
  gap: 9px !important;
}

/* Métricas de Hoy */
.today-metric-grid {
  gap: 9px !important;
}

.today-main-metric,
.today-sales-metric,
.metric-card,
.day-metric,
.calendar-month-metric {
  min-height: 86px !important;
  padding: 13px !important;
  border: 1px solid var(--rt-border) !important;
  border-radius: var(--rt-radius-lg) !important;
  background: var(--rt-surface) !important;
  box-shadow: var(--rt-shadow-card) !important;
}

.today-main-metric span,
.today-sales-metric span,
.metric-card span,
.day-metric span,
.calendar-month-metric span {
  color: var(--rt-muted) !important;
  font-size: 0.72rem !important;
  font-weight: 550 !important;
}

.today-main-metric strong {
  font-size: clamp(1.75rem, 8vw, 2.35rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.055em !important;
}

.today-sales-metric strong {
  font-size: clamp(1.45rem, 7vw, 1.95rem) !important;
  font-weight: 700 !important;
}

/* Conceptos rápidos */
.register-sale-section {
  gap: 13px !important;
}

.personal-concept-grid,
.quick-concept-grid {
  gap: 9px !important;
}

.personal-concept-card,
.quick-concept-btn {
  min-height: 70px !important;
  padding: 12px 13px !important;
  border: 1px solid var(--rt-border) !important;
  border-radius: 14px !important;
  background: var(--rt-surface-soft) !important;
  color: var(--rt-ink) !important;
  box-shadow: none !important;
  transition:
    transform var(--rt-motion-fast) var(--rt-motion-ease),
    border-color var(--rt-motion-fast) var(--rt-motion-ease),
    background var(--rt-motion-fast) var(--rt-motion-ease) !important;
}

.personal-concept-card::after {
  right: 10px !important;
  bottom: 4px !important;
  color: rgba(18, 191, 166, 0.16) !important;
  font-size: 1.5rem !important;
}

.personal-concept-card strong,
.quick-concept-btn strong {
  font-size: 0.86rem !important;
  font-weight: 650 !important;
}

.personal-concept-card span,
.quick-concept-btn span {
  margin-top: 4px !important;
  color: var(--rt-turquoise-deep) !important;
  font-size: 0.7rem !important;
  font-weight: 600 !important;
}

/* Formularios */
.form-field {
  gap: 6px !important;
}

.form-field label {
  color: var(--rt-ink-secondary) !important;
  font-size: 0.82rem !important;
  font-weight: 620 !important;
  letter-spacing: -0.01em !important;
  text-transform: none !important;
}

.form-field input,
.form-field select,
.form-field textarea,
input[type="date"] {
  width: 100%;
  min-width: 0;
  min-height: 48px !important;
  padding: 11px 13px !important;
  border: 1px solid var(--rt-border) !important;
  border-radius: 13px !important;
  background: var(--rt-surface) !important;
  color: var(--rt-ink) !important;
  font-size: 16px !important;
  font-weight: 450 !important;
  line-height: 1.25 !important;
  box-shadow: none !important;
}

.form-field textarea {
  min-height: 76px !important;
  resize: vertical;
}

.form-field input::placeholder,
.form-field textarea::placeholder {
  color: #9AABAF !important;
}

.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus {
  border-color: var(--rt-turquoise) !important;
  outline: 3px solid rgba(18, 191, 166, 0.12) !important;
  box-shadow: none !important;
}

.check-row {
  min-height: 40px;
  gap: 9px !important;
  padding: 7px 0;
  color: var(--rt-ink-secondary) !important;
  font-size: 0.84rem !important;
  font-weight: 520 !important;
}

.check-row input {
  width: 18px !important;
  height: 18px !important;
  accent-color: var(--rt-turquoise-deep);
}

.concept-visibility-help {
  margin: -5px 0 2px 27px !important;
  color: var(--rt-muted);
  font-size: 0.73rem;
  line-height: 1.4;
}

/* Botones */
.primary-btn,
.secondary-btn,
.danger-btn,
.big-save-btn,
.personal-wide-action,
.calendar-today-btn {
  min-height: 46px !important;
  padding: 10px 15px !important;
  border-radius: 13px !important;
  font-size: 0.88rem !important;
  font-weight: 650 !important;
  line-height: 1.15 !important;
  box-shadow: none !important;
  transition:
    transform var(--rt-motion-fast) var(--rt-motion-ease),
    background var(--rt-motion-fast) var(--rt-motion-ease),
    border-color var(--rt-motion-fast) var(--rt-motion-ease) !important;
}

.primary-btn,
.big-save-btn {
  border: 1px solid var(--rt-turquoise) !important;
  background: var(--rt-turquoise) !important;
  color: var(--rt-ink) !important;
}

.primary-btn:hover,
.big-save-btn:hover {
  border-color: var(--rt-turquoise-hover) !important;
  background: var(--rt-turquoise-hover) !important;
}

.secondary-btn,
.calendar-today-btn {
  border: 1px solid var(--rt-border) !important;
  background: var(--rt-surface) !important;
  color: var(--rt-ink-secondary) !important;
}

.danger-btn {
  border: 1px solid rgba(217, 74, 74, 0.24) !important;
  background: var(--rt-alert-soft) !important;
  color: var(--rt-alert) !important;
}

button:active:not(:disabled) {
  transform: scale(0.985) !important;
}

/* Modal de registro y editor: hoja compacta y limpia */
.sale-modal-backdrop,
.sale-editor-backdrop {
  align-items: end !important;
  padding: 0 !important;
  background: rgba(7, 26, 38, 0.32) !important;
  backdrop-filter: blur(3px) !important;
}

.sale-modal-card,
.sale-editor-card {
  width: min(100%, 600px) !important;
  max-height: 91dvh !important;
  margin: 0 auto !important;
  padding:
    16px
    16px
    calc(16px + env(safe-area-inset-bottom)) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  border: 1px solid var(--rt-border) !important;
  border-bottom: 0 !important;
  border-radius: 22px 22px 0 0 !important;
  background: var(--rt-surface) !important;
  box-shadow: 0 -8px 30px rgba(7, 26, 38, 0.13) !important;
  animation: rt-sheet-in var(--rt-motion-base) var(--rt-motion-ease) both !important;
}

.sale-modal-header,
.sale-editor-header {
  align-items: center !important;
  gap: 10px !important;
  margin-bottom: 13px !important;
}

.sale-modal-header span,
.sale-editor-header span {
  color: var(--rt-muted) !important;
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  text-transform: none !important;
}

.sale-modal-header h3,
.sale-editor-header h3 {
  margin: 2px 0 0 !important;
  color: var(--rt-ink) !important;
  font-size: 1.35rem !important;
  font-weight: 700 !important;
  line-height: 1.08 !important;
  letter-spacing: -0.04em !important;
}

.modal-close-btn {
  width: 38px !important;
  height: 38px !important;
  min-width: 38px;
  min-height: 38px;
  border: 1px solid var(--rt-border) !important;
  border-radius: 50% !important;
  background: var(--rt-surface-soft) !important;
  color: var(--rt-ink-secondary) !important;
  font-size: 1.4rem !important;
  font-weight: 400 !important;
}

.sale-modal-card .form-grid,
.sale-editor-card .form-grid {
  gap: 11px !important;
}

.advanced-sale,
.editor-history-panel,
.calendar-professional-disclosure,
.today-sales-disclosure,
.settings-panel,
.concept-accordion,
.objective-settings-item {
  border: 1px solid var(--rt-border) !important;
  border-radius: 14px !important;
  background: var(--rt-surface) !important;
  box-shadow: none !important;
}

.advanced-sale > summary,
.editor-history-panel > summary,
.calendar-professional-disclosure > summary,
.today-sales-disclosure > summary,
.settings-panel > summary,
.concept-accordion > summary,
.objective-settings-item > summary {
  min-height: 48px !important;
  padding: 11px 13px !important;
  color: var(--rt-ink-secondary) !important;
  font-size: 0.86rem !important;
  font-weight: 620 !important;
}

.advanced-sale-content,
.calendar-disclosure-content,
.today-sales-disclosure-content,
.concept-config-form,
.objective-config-form {
  gap: 10px !important;
  padding: 0 13px 13px !important;
}

.sale-modal-preview,
.editor-preview-card,
.calendar-estimation-preview {
  padding: 11px 13px !important;
  border: 1px solid rgba(18, 191, 166, 0.22) !important;
  border-left: 3px solid var(--rt-turquoise) !important;
  border-radius: 13px !important;
  background: var(--rt-turquoise-mist) !important;
  box-shadow: none !important;
}

.sale-modal-preview span,
.editor-preview-card span {
  color: var(--rt-slate) !important;
  font-size: 0.75rem !important;
  font-weight: 550 !important;
}

.sale-modal-preview strong,
.editor-preview-card strong {
  margin-top: 3px !important;
  color: var(--rt-ink) !important;
  font-size: 1.4rem !important;
  font-weight: 700 !important;
  letter-spacing: -0.04em !important;
}

.dashboard-fast-sale-actions,
.concept-action-grid,
.objective-action-grid,
.calendar-close-actions {
  position: static !important;
  gap: 9px !important;
  padding-top: 0 !important;
  background: transparent !important;
}

.composite-register-box,
.composite-config-box,
.editor-sale-block,
.editor-component-row,
.empty-mini,
.personal-empty-state,
.personal-search-empty {
  padding: 12px !important;
  border: 1px solid var(--rt-border) !important;
  border-radius: 14px !important;
  background: var(--rt-surface-soft) !important;
  box-shadow: none !important;
}

.editor-date-grid {
  gap: 9px !important;
}

/* Listas y resultados menos agresivos */
.history-item,
.history-editable-item,
.calendar-editable-sale-card,
.today-recent-sale,
.personal-closure-item,
.list-item,
.feedback-item {
  min-height: 56px !important;
  padding: 11px 12px !important;
  border: 1px solid var(--rt-border) !important;
  border-radius: 13px !important;
  background: var(--rt-surface) !important;
  box-shadow: none !important;
}

.history-filter-card,
.settings-inner-card {
  gap: 13px !important;
}

.history-filter-grid button,
.filter-btn,
.filter-chip {
  min-height: 44px !important;
  border-radius: 12px !important;
  font-size: 0.8rem !important;
  font-weight: 620 !important;
}

.settings-panel {
  overflow: hidden;
}

.settings-inner-card {
  margin: 0 8px 8px !important;
}

.concept-accordion summary em {
  color: var(--rt-turquoise-deep) !important;
  font-size: 0.68rem !important;
  font-weight: 650 !important;
}

/* Estados */
.history-status,
.today-sale-status,
.calendar-sale-payment,
.calendar-day-status-pill,
.calendar-day-closed-pill,
.objective-settings-item summary em {
  padding: 4px 7px !important;
  border-radius: 999px !important;
  font-size: 0.62rem !important;
  font-weight: 650 !important;
}

.status-paid,
.payment-paid,
.is-paid,
.history-status.is-paid {
  background: var(--rt-turquoise-mist) !important;
  color: var(--rt-turquoise-deep) !important;
}

.status-pending,
.payment-pending,
.is-pending,
.history-status.is-pending {
  background: var(--rt-pending-soft) !important;
  color: #B66D06 !important;
}

/* Objetivos y Control Track */
.objective-progress-card {
  gap: 9px !important;
  padding: 12px !important;
  border-radius: 14px !important;
  box-shadow: none !important;
}

.objective-progress-heading b {
  color: var(--rt-turquoise-deep) !important;
  font-size: 0.95rem !important;
  font-weight: 700 !important;
}

.objective-value-line strong {
  font-size: 1.08rem !important;
  font-weight: 700 !important;
}

.objective-progress-track {
  height: 7px !important;
  background: #ECF1F1 !important;
}

.objective-progress-track span {
  background: var(--rt-turquoise) !important;
  transition: width 420ms var(--rt-motion-ease) !important;
}

/* Navegación fija, pegada al borde inferior, no flotante */
.bottom-nav {
  position: fixed !important;
  left: 50% !important;
  right: auto !important;
  bottom: 0 !important;
  z-index: 90;
  width: min(100%, 760px) !important;
  max-width: 100% !important;
  min-height:
    calc(
      var(--rt-fixed-nav-height) +
      env(safe-area-inset-bottom)
    ) !important;
  transform: translateX(-50%) !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 0 !important;
  padding:
    5px
    max(5px, env(safe-area-inset-right))
    calc(5px + env(safe-area-inset-bottom))
    max(5px, env(safe-area-inset-left)) !important;
  border: 0 !important;
  border-top: 1px solid var(--rt-border) !important;
  border-radius: 0 !important;
  background: rgba(255, 255, 255, 0.97) !important;
  box-shadow: 0 -4px 16px rgba(7, 26, 38, 0.055) !important;
  backdrop-filter: blur(14px) !important;
  overflow: visible !important;
}

.bottom-nav .bottom-nav-item,
.bottom-nav button {
  position: relative;
  min-width: 0 !important;
  min-height: 54px !important;
  grid-template-rows: 22px auto !important;
  gap: 2px !important;
  padding: 6px 2px !important;
  border: 0 !important;
  border-radius: 11px !important;
  background: transparent !important;
  color: var(--rt-muted) !important;
  box-shadow: none !important;
}

.bottom-nav .bottom-nav-item::before,
.bottom-nav button::before {
  content: "";
  position: absolute;
  top: 1px;
  left: 50%;
  width: 22px;
  height: 2px;
  border-radius: 999px;
  background: transparent;
  transform: translateX(-50%);
}

.bottom-nav .bottom-nav-item.is-active,
.bottom-nav button.is-active {
  background: var(--rt-turquoise-mist) !important;
  color: var(--rt-turquoise-deep) !important;
}

.bottom-nav .bottom-nav-item.is-active::before,
.bottom-nav button.is-active::before {
  background: var(--rt-turquoise);
}

.bottom-nav .nav-icon,
.bottom-nav button > span {
  font-size: 1.03rem !important;
  line-height: 1 !important;
}

.bottom-nav button small {
  font-size: clamp(0.58rem, 2.25vw, 0.68rem) !important;
  font-weight: 600 !important;
  line-height: 1.05 !important;
  letter-spacing: -0.015em !important;
}

/* Animaciones discretas */
@keyframes rt-screen-in {
  from {
    opacity: 0;
    transform: translateY(5px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes rt-sheet-in {
  from {
    opacity: 0;
    transform: translateY(18px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

details[open] > .advanced-sale-content,
details[open] > .calendar-disclosure-content,
details[open] > .today-sales-disclosure-content,
details[open] > .concept-config-form,
details[open] > .objective-config-form {
  animation: rt-content-in var(--rt-motion-fast) var(--rt-motion-ease) both;
}

@keyframes rt-content-in {
  from {
    opacity: 0;
    transform: translateY(-3px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (min-width: 700px) {
  .sale-modal-backdrop,
  .sale-editor-backdrop {
    align-items: center !important;
    padding: 18px !important;
  }

  .sale-modal-card,
  .sale-editor-card {
    border-bottom: 1px solid var(--rt-border) !important;
    border-radius: 20px !important;
  }
}

@media (max-width: 560px) {
  html {
    font-size: 14.5px;
  }

  .screen {
    padding-top: 12px;
  }

  .app-header .rt-brand-logo {
    width: clamp(132px, 41vw, 158px) !important;
  }

  .app-header h1 {
    font-size: 0.7rem !important;
  }

  .today-metric-grid {
    grid-template-columns: 1.35fr 0.8fr !important;
  }

  .personal-concept-grid,
  .quick-concept-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .dashboard-fast-sale-actions,
  .concept-action-grid,
  .objective-action-grid,
  .calendar-close-actions {
    grid-template-columns: 1fr !important;
  }

  .calendar-day-metric-grid,
  .calendar-month-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 370px) {
  .app-header .rt-brand-logo {
    width: 126px !important;
  }

  .app-header h1 {
    display: none !important;
  }

  .personal-page-heading h2,
  .screen-header h2 {
    font-size: 1.65rem !important;
  }

  .bottom-nav button small {
    font-size: 0.54rem !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}
