/**
 * Famylio shared shapes
 * Central source for radii, shadows, spacing rhythm and tactile controls.
 *
 * Computed visual data may stay local (calendar colors, avatar colors,
 * progress values). Structural shapes should come from this file.
 */

:root{
  --fam-shape-2xs:6px;
  --fam-shape-xs:9px;
  --fam-shape-sm:12px;
  --fam-shape-md:16px;
  --fam-shape-lg:22px;
  --fam-shape-xl:28px;
  --fam-shape-2xl:34px;
  --fam-shape-pill:999px;

  --fam-space-2xs:4px;
  --fam-space-xs:8px;
  --fam-space-sm:12px;
  --fam-space-md:16px;
  --fam-space-lg:22px;
  --fam-space-xl:30px;

  --fam-homothety:1;
  --fam-layout-scale:var(--fam-homothety,1);
  --fam-readable-font:clamp(15px,1.04vw,17px);
  --fam-readable-small:clamp(12.5px,.86vw,14px);
  --fam-action-size:clamp(40px,4.2vw,48px);
  --fam-header-gap:clamp(8px,1.2vw,16px);
  --fam-page-pad-x:clamp(12px,2vw,30px);

  --fam-line-soft:rgba(31,45,66,.075);
  --fam-line:rgba(31,45,66,.115);
  --fam-line-strong:rgba(31,45,66,.16);
  --fam-surface:rgba(255,255,255,.94);
  --fam-surface-soft:rgba(255,252,247,.92);
  --fam-ink:var(--navy,var(--bo-blue,#002952));
  --fam-accent:var(--terra,var(--bo-orange,#EC520C));

  --fam-shadow-xs:0 1px 3px rgba(31,45,66,.05);
  --fam-shadow-sm:0 8px 22px rgba(31,45,66,.055),0 1px 3px rgba(31,45,66,.04);
  --fam-shadow-card:0 18px 52px rgba(31,45,66,.082),0 4px 14px rgba(31,45,66,.052);
  --fam-shadow-card-hover:0 26px 72px rgba(31,45,66,.115),0 8px 24px rgba(31,45,66,.065);
  --fam-shadow-float:0 34px 100px rgba(31,45,66,.20),0 12px 30px rgba(31,45,66,.10);
  --fam-focus:0 12px 26px color-mix(in srgb,var(--fam-accent) 14%,transparent);

  --radius:var(--fam-shape-lg);
  --radius-sm:var(--fam-shape-sm);
  --radius-lg:var(--fam-shape-xl);
  --card-shadow:var(--fam-shadow-card);
  --card-hover:var(--fam-shadow-card-hover);
}

.fam-density-compact{
  --fam-visible-mode:essential;
}

.fam-density-cozy{
  --fam-visible-mode:focused;
}

.fam-density-wide{
  --fam-visible-mode:full;
}

html{
  font-size:var(--fam-readable-font);
}

html:not(.dark) body.famylio-shell{
  background:
    radial-gradient(circle at 72% 0%, rgba(200,111,88,.055), transparent 360px),
    radial-gradient(circle at 28% 0%, rgba(91,138,114,.055), transparent 340px),
    linear-gradient(180deg,#fff 0%,#fff 64%,#fbfaf8 100%);
}

@supports not (color:color-mix(in srgb,#000 50%,transparent)){
  :root{--fam-focus:0 12px 26px rgba(236,82,12,.12)}
}

/* Cards and panels: no colored side strips, just calm structure and shadow. */
:where(
  .card,.bo-card,.stat-card,.dashboard-card,.module-card,.service-card,.setting-card,
  .contact-card,.family-card,.member-row,.device-card,.hub-device,.app-card,.widget-card,
  .budget-smart-card,.goal-card,.goal-transfer-modal-card,.wallet-card,.cat-config-card,
  .recurring-favorite,.recurring-reminder-item,
  .dish-card,.recipe-card,.bdi-recipe-card,.bdi-daily-card,.bdi-daily-recipe,
  .bdi-search-panel,.bdi-filter-panel,.bdi-actions-panel,.bdi-serving-panel,.bdi-guided-panel,
  .agenda-filter-shell,.agenda-filter-group,.agenda-week-card,.agenda-list-card,
  .agenda-month-card,.agenda-day-panel,.agenda-upcoming-wide,.agenda-upcoming-panel,
  .ev-card,.day-event-card,.cust-rule-card,.cust-exc-card,.cust-pending-card,.cust-flow-card,
  .pet-card,.pet-detail-header,.pet-detail-card,.pet-vet-card,.pet-share-row,
  .loyalty-card,.secretary-card,.secretary-inbox,.secretary-panel,
  .scan-device-box,.scan-source-card,.scan-device-qr-card,.empty-state,
  .rs-card,.sa-card,.mkt-card,.legal-card,.legal-section,
  .hero-pcard,.av-card,.mod-card,.ylio-card,.testi-card,.sim-panel,.sim-total-card,
  .foyer-type,.member-row,.cc-card,.newsletter-card
){
  border-radius:var(--fam-shape-lg)!important;
  box-shadow:var(--fam-shadow-card)!important;
}

:where(
  .card,.bo-card,.stat-card,.dashboard-card,.module-card,.service-card,.setting-card,
  .contact-card,.family-card,.member-row,.device-card,.hub-device,.app-card,.widget-card,
  .budget-smart-card,.goal-card,.wallet-card,.cat-config-card,.recurring-favorite,
  .dish-card,.recipe-card,.bdi-recipe-card,.bdi-daily-recipe,.agenda-week-card,
  .agenda-list-card,.agenda-month-card,.pet-card,.loyalty-card,.rs-card,.sa-card,
  .mkt-card,.legal-card,.hero-pcard,.av-card,.mod-card,.ylio-card,.testi-card
):hover{
  box-shadow:var(--fam-shadow-card-hover)!important;
}

:where(.card,.bo-card,.stat-card,.dashboard-card,.module-card,.service-card,.setting-card,
  .contact-card,.family-card,.device-card,.hub-device,.app-card,.widget-card,
  .budget-smart-card,.goal-card,.wallet-card,.pet-card,.loyalty-card,.bdi-recipe-card,
  .agenda-week-card,.agenda-list-card,.agenda-month-card,.rs-card,.sa-card,.mkt-card,
  .legal-card,.hero-pcard,.av-card,.mod-card,.ylio-card,.testi-card)::before,
:where(.card,.bo-card,.stat-card,.dashboard-card,.module-card,.service-card,.setting-card,
  .contact-card,.family-card,.device-card,.hub-device,.app-card,.widget-card,
  .budget-smart-card,.goal-card,.wallet-card,.pet-card,.loyalty-card,.bdi-recipe-card,
  .agenda-week-card,.agenda-list-card,.agenda-month-card,.rs-card,.sa-card,.mkt-card,
  .legal-card,.hero-pcard,.av-card,.mod-card,.ylio-card,.testi-card)::after{
  border-left-width:0!important;
}

/* Controls. */
:where(
  .btn,.btn-terra,.btn-outline,.btn-secondary,.btn-secondary-sm,.btn-primary-sm,
  .btn-add,.btn-manage,.bdi-btn-primary,.bdi-btn-secondary,.cust-action-btn,
  .cust-rule-btn,.tx-action-btn,.topbar-btn,.theme-toggle,.sidebar-toggle,
  .topbar-lang-btn,.topbar-call-btn,.mkt-btn,.rs-btn,.sa-btn,.sim-btn-add,
  .cc-btn,.scan-source-card,.agenda-week-nav-btn,.agenda-filter-reset
){
  border-radius:var(--fam-shape-md)!important;
}

:where(
  .topbar-btn,.theme-toggle,.sidebar-toggle,.topbar-lang-btn,.topbar-call-btn,
  .btn,.btn-terra,.btn-outline,.btn-secondary,.btn-add,.bdi-btn-primary,
  .bdi-btn-secondary,.mkt-btn,.rs-btn,.sa-btn,.cc-btn
){
  min-height:var(--fam-action-size);
}

:where(.btn,.btn-terra,.btn-outline,.btn-secondary,.btn-add,.bdi-btn-primary,
  .bdi-btn-secondary,.topbar-btn,.theme-toggle,.topbar-call-btn,.mkt-btn,.rs-btn,
  .sa-btn,.cc-btn){
  box-shadow:var(--fam-shadow-sm)!important;
}

:where(.btn,.btn-terra,.btn-outline,.btn-secondary,.btn-add,.bdi-btn-primary,
  .bdi-btn-secondary,.topbar-btn,.theme-toggle,.topbar-call-btn,.mkt-btn,.rs-btn,
  .sa-btn,.cc-btn):hover{
  transform:translateY(-1px);
}

/* Forms and searchable surfaces. */
:where(
  input[type="text"],input[type="email"],input[type="password"],input[type="number"],
  input[type="date"],input[type="time"],input[type="search"],input[type="tel"],
  textarea,select,.form-input,.search-input,.bdi-search-input
){
  border-radius:var(--fam-shape-md)!important;
}

:where(input,textarea,select,.form-input,.search-input,.bdi-search-input):focus,
:where(input,textarea,select,.form-input,.search-input,.bdi-search-input):focus-visible{
  outline:0!important;
  border-color:rgba(212,101,74,.52)!important;
  border-color:color-mix(in srgb,var(--fam-accent) 52%,var(--fam-line))!important;
  box-shadow:var(--fam-focus)!important;
}

/* Modals and overlays. */
:where(.modal,.modal-content,.gbday-modal,.fd-modal,.agenda-large-shell,.bo-pets-modal > .modal-content){
  border-radius:var(--fam-shape-xl)!important;
  box-shadow:var(--fam-shadow-float)!important;
}

:where(.modal-overlay,.bo-pets-modal,.fd-overlay,.agenda-large-modal){
  backdrop-filter:blur(14px) saturate(118%);
  -webkit-backdrop-filter:blur(14px) saturate(118%);
}

/* Chips, tabs and badges. */
:where(
  .nav-badge,.mep-badge,.sidebar-more-count,.dt-status,.badge,.tag,.pill,
  .bdi-filter-chip,.agenda-filter-chip,.agenda-category-chip,.agenda-cat-pill,
  .budget-tab,.food-tab,.topbar-lang-btn,.kpi-cell,.hero-pill,.sec-badge
){
  border-radius:var(--fam-shape-pill)!important;
}

:where(.budget-tab,.food-tab,.agenda-switch,.bdi-view-toggle,.segmented-control){
  border-radius:var(--fam-shape-lg)!important;
}

/* Media should feel tactile and finished. */
:where(
  .bdi-recipe-card img,.bdi-daily-card img,.recipe-card img,.dish-card img,
  .hero-media img,.hero-pcard img,.ylio-gallery img,.product-card img,
  .pet-card img,.contact-card img,.loyalty-card img,.mod-card img,.av-card img
){
  border-radius:var(--fam-shape-md)!important;
}

/* Tables and list rows. */
:where(.data-table,.table-card,.list-panel){
  border-radius:var(--fam-shape-lg)!important;
}

:where(.data-table tbody tr,.bdi-list-row,.agenda-list-event,.agenda-week-event,.pet-share-row){
  border-radius:var(--fam-shape-md)!important;
}

/* Famylio 5-breakpoint rhythm: wide / desktop / tablet landscape / tablet portrait / phone. */
@media (min-width:1440px){
  :root{
    --fam-page-pad-x:30px;
    --fam-action-size:48px;
  }
}

@media (max-width:1439px){
  :root{
    --fam-page-pad-x:clamp(18px,2vw,28px);
  }
}

@media (max-width:1180px){
  :root{
    --fam-action-size:44px;
    --fam-header-gap:12px;
    --fam-readable-font:clamp(15.5px,1.8vw,16.75px);
  }
}

@media (max-width:900px){
  :root{
    --fam-action-size:42px;
    --fam-page-pad-x:14px;
    --fam-readable-font:16px;
  }
}

@media (max-width:560px){
  :root{
    --fam-action-size:42px;
    --fam-page-pad-x:10px;
    --fam-readable-font:15.75px;
  }
}

@media (max-width:640px){
  :root{
    --fam-shape-lg:18px;
    --fam-shape-xl:22px;
    --fam-shadow-card:0 12px 34px rgba(31,45,66,.075),0 2px 8px rgba(31,45,66,.045);
    --fam-shadow-float:0 22px 70px rgba(31,45,66,.20),0 8px 22px rgba(31,45,66,.10);
  }

  :where(.modal,.modal-content,.gbday-modal,.fd-modal,.agenda-large-shell,.bo-pets-modal > .modal-content){
    border-radius:var(--fam-shape-lg)!important;
  }
}

/* Smooth UI rule: one visible edge per component.
   Avoid stacked border + outline + inset shadow, while keeping keyboard focus clear. */
:root{
  --fam-shadow-control:0 7px 18px rgba(31,45,66,.055);
  --fam-shadow-control-hover:0 10px 24px rgba(31,45,66,.075);
  --fam-shadow-control-active:0 11px 26px rgba(179,91,69,.15);
  --fam-edge-control:1px solid var(--fam-line-soft);
}

:where(
  .btn,.btn-terra,.btn-outline,.btn-secondary,.btn-secondary-sm,.btn-primary-sm,
  .btn-add,.btn-manage,.bdi-btn-primary,.bdi-btn-secondary,.cust-action-btn,
  .cust-rule-btn,.tx-action-btn,.bdi-view-primary-btn,.bdi-guided-nav-btn,
  .bdi-guided-control-btn,.bdi-search-submit,.bdi-search-clear,.bdi-serving-option,
  .bdi-view-btn,.bdi-src-chip,.bdi-cat-chip,.bdi-filter-chip,.agenda-filter-chip,
  .agenda-category-chip,.agenda-cat-pill,.budget-tab,.food-tab,.scan-source-card,
  .topbar-btn,.theme-toggle,.topbar-lang-btn,.topbar-call-btn,.mkt-btn,.rs-btn,
  .sa-btn,.cc-btn
){
  outline:0!important;
  box-shadow:var(--fam-shadow-control)!important;
}

:where(
  .btn-terra,.btn-add,.btn-manage,.bdi-btn-primary,.bdi-search-submit,
  .bdi-view-primary-btn.is-primary,.bdi-guided-control-btn.btn-terra,
  .cust-action-btn.primary,.btn-primary-sm
){
  border:1px solid transparent!important;
}

:where(
  .btn-outline,.btn-secondary,.btn-secondary-sm,.bdi-btn-secondary,
  .bdi-guided-nav-btn,.bdi-search-clear,.bdi-serving-option,.bdi-view-btn,
  .bdi-src-chip,.bdi-cat-chip,.bdi-filter-chip,.agenda-filter-chip,
  .agenda-category-chip,.agenda-cat-pill,.budget-tab,.food-tab,.scan-source-card,
  .topbar-btn,.theme-toggle,.topbar-lang-btn,.topbar-call-btn,.mkt-btn,.rs-btn,
  .sa-btn,.cc-btn
){
  border-width:1px!important;
  border-style:solid!important;
}

:where(
  .btn,.btn-terra,.btn-outline,.btn-secondary,.btn-secondary-sm,.btn-primary-sm,
  .btn-add,.btn-manage,.bdi-btn-primary,.bdi-btn-secondary,.cust-action-btn,
  .cust-rule-btn,.tx-action-btn,.bdi-view-primary-btn,.bdi-guided-nav-btn,
  .bdi-guided-control-btn,.bdi-search-submit,.bdi-search-clear,.bdi-serving-option,
  .bdi-view-btn,.bdi-src-chip,.bdi-cat-chip,.bdi-filter-chip,.agenda-filter-chip,
  .agenda-category-chip,.agenda-cat-pill,.budget-tab,.food-tab,.scan-source-card,
  .topbar-btn,.theme-toggle,.topbar-lang-btn,.topbar-call-btn,.mkt-btn,.rs-btn,
  .sa-btn,.cc-btn
):hover{
  box-shadow:var(--fam-shadow-control-hover)!important;
}

:where(
  .btn,.btn-terra,.btn-outline,.btn-secondary,.btn-secondary-sm,.btn-primary-sm,
  .btn-add,.btn-manage,.bdi-btn-primary,.bdi-btn-secondary,.cust-action-btn,
  .cust-rule-btn,.tx-action-btn,.bdi-view-primary-btn,.bdi-guided-nav-btn,
  .bdi-guided-control-btn,.bdi-search-submit,.bdi-search-clear,.bdi-serving-option,
  .bdi-view-btn,.bdi-src-chip,.bdi-cat-chip,.bdi-filter-chip,.agenda-filter-chip,
  .agenda-category-chip,.agenda-cat-pill,.budget-tab,.food-tab,.scan-source-card,
  .topbar-btn,.theme-toggle,.topbar-lang-btn,.topbar-call-btn,.mkt-btn,.rs-btn,
  .sa-btn,.cc-btn
):focus:not(:focus-visible){
  outline:0!important;
}

:where(
  .btn,.btn-terra,.btn-outline,.btn-secondary,.btn-secondary-sm,.btn-primary-sm,
  .btn-add,.btn-manage,.bdi-btn-primary,.bdi-btn-secondary,.cust-action-btn,
  .cust-rule-btn,.tx-action-btn,.bdi-view-primary-btn,.bdi-guided-nav-btn,
  .bdi-guided-control-btn,.bdi-search-submit,.bdi-search-clear,.bdi-serving-option,
  .bdi-view-btn,.bdi-src-chip,.bdi-cat-chip,.bdi-filter-chip,.agenda-filter-chip,
  .agenda-category-chip,.agenda-cat-pill,.budget-tab,.food-tab,.scan-source-card,
  .topbar-btn,.theme-toggle,.topbar-lang-btn,.topbar-call-btn,.mkt-btn,.rs-btn,
  .sa-btn,.cc-btn
):focus-visible{
  outline:0!important;
  border-color:rgba(212,101,74,.42)!important;
  border-color:color-mix(in srgb,var(--fam-accent) 42%,var(--fam-line))!important;
  box-shadow:var(--fam-shadow-control),var(--fam-focus)!important;
}

:where(
  .active,.is-active,.is-selected,.selected,[aria-selected="true"],[aria-pressed="true"]
).btn,
:where(.bdi-serving-option.active,.bdi-view-btn.active,.bdi-filter-chip.active,
  .bdi-src-chip.active,.bdi-cat-chip.active,.agenda-filter-chip.active,
  .agenda-category-chip.active,.budget-tab.active,.food-tab.active,
  .bdi-view-primary-btn.is-primary){
  border-color:transparent!important;
  box-shadow:var(--fam-shadow-control-active)!important;
}

:where(
  .bdi-view-primary-actions,.bdi-serving-panel,.bdi-filter-head,.bdi-filter-group,
  .bdi-guided-panel,.bdi-eda-help,.bdi-filter-clear,.bdi-recipe-fav,
  .bdi-daily-actions span,.agenda-filter-shell,.agenda-filter-group,
  .scan-device-box,.scan-device-qr-card
){
  box-shadow:none!important;
}

:where(
  .bdi-view-primary-actions,.bdi-serving-panel,.bdi-filter-head,.bdi-filter-group,
  .bdi-guided-panel,.bdi-eda-help,.agenda-filter-shell,.agenda-filter-group,
  .scan-device-box,.scan-device-qr-card
){
  border:1px solid var(--fam-line-soft)!important;
}

.bdi-kpi-link.active,
.bdi-kpi-link.is-just-selected{
  box-shadow:var(--fam-shadow-control-active)!important;
}

html.dark .bdi-kpi-link.active,
html.dark .bdi-kpi-link.is-just-selected{
  box-shadow:0 10px 24px rgba(208,138,118,.14)!important;
}

/* No double-border contract.
   Focus and selected states must never draw a second hard outline around an
   existing border. Keep one border, then use a soft cast shadow only. */
:where(
  input,textarea,select,.form-input,.search-input,.bdi-search-input,
  .btn,.btn-terra,.btn-outline,.btn-secondary,.btn-secondary-sm,.btn-primary-sm,
  .btn-add,.btn-manage,.bdi-btn-primary,.bdi-btn-secondary,.cust-action-btn,
  .cust-rule-btn,.tx-action-btn,.topbar-btn,.theme-toggle,.topbar-lang-btn,
  .topbar-call-btn,.scan-source-card,.touch-btn,.touch-action-btn,.safe-share-url,
  .fus-source,.fus-close,.fus-cancel,.fus-copy,.fus-dropzone,.ap-item,
  .color-pick-item,.bo-crud-tab,.tab-btn,.filter-chip,.doc-filter-chip,.chip,.pill
):focus,
:where(
  input,textarea,select,.form-input,.search-input,.bdi-search-input,
  .btn,.btn-terra,.btn-outline,.btn-secondary,.btn-secondary-sm,.btn-primary-sm,
  .btn-add,.btn-manage,.bdi-btn-primary,.bdi-btn-secondary,.cust-action-btn,
  .cust-rule-btn,.tx-action-btn,.topbar-btn,.theme-toggle,.topbar-lang-btn,
  .topbar-call-btn,.scan-source-card,.touch-btn,.touch-action-btn,.safe-share-url,
  .fus-source,.fus-close,.fus-cancel,.fus-copy,.fus-dropzone,.ap-item,
  .color-pick-item,.bo-crud-tab,.tab-btn,.filter-chip,.doc-filter-chip,.chip,.pill
):focus-visible{
  outline:0!important;
  outline-offset:0!important;
  box-shadow:0 12px 26px rgba(212,101,74,.10)!important;
}