/* Immobackup · Ticket 166. Logo: navy + gold; shared source for all web surfaces. */
@layer tokens, base, shell, modules, utilities, accessibility;
@import url("/css/ui-tokens.css?v=172");
@import url("/css/ui-utilities.css?v=172") layer(utilities);

@layer base {
  html { scroll-behavior: smooth; }
  img, svg, canvas { max-width: 100%; }
  button, input, select, textarea { font: inherit; }
  button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
  .ui-icon { display: inline-block; width: 1.2rem; height: 1.2rem; flex: 0 0 auto; vertical-align: -.2em; }
}
@layer accessibility {
.sidebar :focus-visible { outline-color: var(--brand-accent); }

body { font-family:var(--font-ui); }
input:is([type="checkbox"], [type="radio"]) { accent-color: var(--brand-primary); }
button, input, select, textarea { font-family:inherit; }
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 3px;
}
:where(input, select, textarea):focus-visible {
  border-color: var(--focus);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--info) 18%, transparent);
}
body[data-design-surface="standalone"] { color: var(--text); background: var(--paper); line-height: 1.5; }
[data-design-surface="standalone"] :is(h1, h2, h3) {
  font-family:var(--font-ui);
  overflow-wrap: anywhere;
}
[data-design-surface="standalone"] h1 { color: var(--brand-primary); }
[data-design-surface="standalone"] :is(button, .button, .btn, .btn-submit, select) {
  min-height: var(--control-size);
  border-radius: var(--radius-control);
}
[data-design-surface="standalone"] :is(input:not([type="checkbox"]):not([type="radio"]), textarea) { border-radius: var(--radius-control); }
[data-design-surface="standalone"] :is(header > div, .header-actions, .topbar, .step-info) { flex-wrap: wrap; }
[data-design-surface="standalone"] :is(main, .content, .inner, .form-area, .form-box) { min-width: 0; }
[data-design-surface="standalone"] :is(.card, .role-card) { min-width: 0; border-radius: var(--radius-md); }
[data-design-surface="standalone"] :is(.form-grid, .form-row) > * { min-width: 0; }
[data-design-surface="standalone"] :is(.secret, .code, .uri) { background: var(--surface-subtle); }
[data-design-surface="standalone"] .alert:not(.error) { border-color: var(--line); }
@media (max-width: 800px) {
  [data-design-surface="standalone"] header > div { gap: 12px; }
  [data-design-surface="standalone"] .header-actions { gap: 10px 16px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
@media print {
  body[data-design-surface="standalone"] { background: var(--white); }
}

  :where(button, .btn, .btn-submit, select, input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"])) { min-height: var(--control-size); }
  :where(button, .btn, .btn-submit):disabled { cursor: not-allowed; opacity: .55; }
  :where(.card, .stat, .cockpit-card, .quick-card, .widget-card, .status-card) { min-width: 0; }
  :where(h1, h2, h3, .stat-label, .card-header) { overflow-wrap: anywhere; }
  :where(.stat-value, .widget-card strong, .cockpit-kpi strong) { font-variant-numeric: tabular-nums; }
}

/* Shared control geometry. This final layer also covers older module styles.
   Containers retain their larger radii; avatars, radio marks and progress bars
   keep their circular/track shapes. Only the outer control shape is unified. */
@layer controls {
  :where(
    button, .btn, .button, .btn-submit, .btn-linklike, .back-btn,
    .bell-toggle, .partner-button, .dashboard-icon-btn, .dashboard-action-btn, .ob-btn,
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]),
    select, textarea, .ui-field,
    .badge, .ui-badge, .group-chip, .bell-badge, .badge-confirmed, .badge-pending,
    .dashboard-badge, .dashboard-pill, .rental-tag, .rental-preview-pill, .rental-scope__tag,
    .tag, .od-badge, .bviz-chip, .choice-badge, .meta-pill, .ea-tag,
    .cockpit-action__badge, .internal-faq-badge, .contract-card__badge, .heat-chip,
    .fr-badge, .object-role-badge, .ai-model-badge, .feature-tag,
    .accounting-count, .user-verify-flag, .cockpit-count, .cockpit-action__signal,
    .faq-guide-count, .invite-role, .ea-suggestion-label, .step-eyebrow, .wiz-eyebrow,
    .hero-eyebrow, .eyebrow, .status,
    .partner-tags li, .partner-example, .ocr-chips span,
    .doc-category-nav a, .doc-category-nav a span, .faq-subnav a, .faq-category-nav a,
    .ob-review-field__pencil, .house-model-modal__help, .bviz-3d-help
  ) { border-radius: var(--radius-control); }

  input::file-selector-button { border-radius: var(--radius-control); }
}
