/* Omvia Cloud 2.0.3 — Adaptive Mobile Geometry + Universal Display Controls.
   Final additive authority. Uses real visual viewport metrics supplied by omvia-adaptive-v2.0.7.js. */
:root{
  --oc-auto-gutter:16px;
  --oc-auto-gap:10px;
  --oc-auto-control:42px;
  --oc-auto-radius:13px;
  --oc-auto-nav-height:74px;
  --oc-auto-row-gap:10px;
  --oc-auto-usable-w:calc(100vw - var(--oc-safe-left,0px) - var(--oc-safe-right,0px));
}
html{--oc-adaptive-version:'2.0.3'}
html,body{max-width:100%;overflow-x:hidden}
body :where(main,section,article,header,nav,aside,div,form){min-width:0}

/* Utility controls are one ordered group: Language → Theme. Plans stay in the tools/navigation column. */
.omvia-display-controls{display:flex;align-items:center;justify-content:flex-end;gap:var(--oc-auto-gap);min-width:0;flex:0 0 auto}
.omvia-display-controls>*{box-sizing:border-box;flex:0 0 auto}
.omvia-display-controls .lang-toggle,
.omvia-display-controls [data-theme-toggle]{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;min-width:var(--oc-auto-control)!important;width:var(--oc-auto-control)!important;height:var(--oc-auto-control)!important;min-height:var(--oc-auto-control)!important;max-height:var(--oc-auto-control)!important;padding:0!important;margin:0!important;border:1px solid var(--line,#d7e2f0)!important;border-radius:var(--oc-auto-radius)!important;background:var(--panel,#fff)!important;color:var(--text,#0b1730)!important;box-shadow:none!important;text-decoration:none!important;line-height:1!important;white-space:nowrap!important;overflow:hidden!important}
html[data-theme="dark"] .omvia-display-controls .lang-toggle,
html[data-theme="dark"] .omvia-display-controls [data-theme-toggle]{background:var(--panel,#0d1a2d)!important;color:var(--text,#f6f8fc)!important}
.omvia-display-controls .lang-toggle{font-size:10px!important;font-weight:900!important;letter-spacing:.07em!important}
.omvia-display-controls [data-theme-toggle]{padding:0!important;width:var(--oc-auto-control)!important}
.omvia-display-controls svg{display:block!important;width:18px!important;height:18px!important;max-width:18px!important;max-height:18px!important;flex:0 0 18px!important}
.omvia-display-controls .omvia-control-label{display:inline;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* The adaptive layer intentionally defeats old mobile rules that hid theme controls. */
@media(max-width:960px){
  body:not(.media-immersive-page) :where(.ref-main,.files-ref-main,.page-main,.account-main,.admin-main,.gallery-main){padding-left:max(var(--oc-auto-gutter),var(--oc-safe-left,0px))!important;padding-right:max(var(--oc-auto-gutter),var(--oc-safe-right,0px))!important}
  body:not(.media-immersive-page) :where(.page-shell,.account-shell,.admin-workspace,.gallery-experience-shell,.ref-shell){max-width:100%!important;overflow-x:clip!important}

  /* Mobile/PWA display controls are a dedicated row, never loose floating buttons. */
  .omvia-display-controls.omvia-mobile-utility-row{display:flex!important;align-items:center!important;justify-content:flex-start!important;flex-wrap:wrap!important;gap:var(--oc-auto-gap)!important;width:auto!important;max-width:calc(100% - max(var(--oc-auto-gutter),var(--oc-safe-left,0px)) - max(var(--oc-auto-gutter),var(--oc-safe-right,0px)))!important;margin:var(--oc-auto-row-gap) max(var(--oc-auto-gutter),var(--oc-safe-left,0px)) 2px!important;padding:0!important;position:relative!important;inset:auto!important;z-index:60!important;transform:none!important}
  .omvia-display-controls.omvia-mobile-utility-row>*{width:auto!important;min-width:var(--oc-auto-control)!important;max-width:none!important;height:var(--oc-auto-control)!important;min-height:var(--oc-auto-control)!important;justify-self:auto!important;flex:0 0 auto!important}
  .omvia-display-controls.omvia-mobile-utility-row .omvia-plan-control{padding-inline:12px!important;min-width:96px!important}
  .omvia-display-controls.omvia-mobile-utility-row .lang-toggle{padding:0 14px!important;min-width:76px!important;width:auto!important}
  .omvia-display-controls.omvia-mobile-utility-row [data-theme-toggle]{width:var(--oc-auto-control)!important}

  /* Complex dashboard/gallery headers keep only their native essentials in row 1.
     The universal controls live in the organized row immediately below. */
  .ref-top-actions .omvia-display-controls,.gallery-top-actions .omvia-display-controls{display:none!important}
  .ref-top-actions [data-theme-toggle],.gallery-top-actions [data-theme-toggle]{display:none!important}
  .ref-top-actions .ref-help,.ref-top-actions .home-mode-button{display:none!important}

  /* Adaptive horizontal padding for primary content blocks. */
  :where(.ref-heading,.ref-content-grid,.files-heading,.files-primary-actions,.files-filter-strip,.account-layout,.account-hero,.page-heading,.section-card,.platform-two-col,.platform-metric-grid,.device-grid,.pricing-page-shell .price-head,.pricing-page-shell .price-grid,.pricing-page-shell .payment-rails){max-width:100%;min-width:0}

  /* Buttons/actions use available width instead of shrinking into tall narrow pills. */
  :where(.files-primary-actions,.modal-actions,.account-photo-actions,.device-actions,.folder-option-stack,.admin-form-actions,.platform-form-actions)[data-oc-action-density="stack"]{display:grid!important;grid-template-columns:1fr!important;gap:var(--oc-auto-gap)!important}
  :where(.files-primary-actions,.modal-actions,.account-photo-actions,.device-actions,.folder-option-stack,.admin-form-actions,.platform-form-actions)[data-oc-action-density="grid"]{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:var(--oc-auto-gap)!important}
  :where(.files-primary-actions,.modal-actions,.account-photo-actions,.device-actions,.folder-option-stack,.admin-form-actions,.platform-form-actions)>:where(.btn,button,a,label){min-width:0!important;max-width:100%!important;white-space:normal!important;overflow-wrap:anywhere!important;text-align:center!important}
  :where(.section-head,.page-heading,.admin-top,.account-top,.page-topbar,.gallery-topbar){min-width:0!important;column-gap:var(--oc-auto-gap)!important;row-gap:var(--oc-auto-row-gap)!important}
  :where(.section-head,.page-heading)>:where(.btn,a.btn,button.btn){flex:0 1 auto!important;min-width:min(100%,120px)!important;max-width:100%!important;white-space:normal!important}

  /* Bottom nav follows the current visual viewport and safe area continuously. */
  .ref-mobile-nav,.gallery-mobile-nav,.mobile-nav{--oc-nav-height:calc(var(--oc-auto-nav-height) + var(--oc-safe-bottom,0px))!important;height:var(--oc-nav-height)!important;min-height:var(--oc-nav-height)!important;padding-left:max(6px,var(--oc-safe-left,0px))!important;padding-right:max(6px,var(--oc-safe-right,0px))!important;padding-bottom:calc(5px + var(--oc-safe-bottom,0px))!important}
  .ref-mobile-nav>a,.gallery-mobile-nav>a,.mobile-nav>a{min-width:0!important;height:calc(var(--oc-auto-nav-height) - 18px)!important;padding-inline:2px!important;overflow:hidden!important}
  .ref-mobile-nav a span,.gallery-mobile-nav a span,.mobile-nav a span{font-size:clamp(9px,calc(var(--oc-viewport-w,390px) / 34),11.5px)!important;max-width:100%!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .ref-mobile-create,.gallery-mobile-nav .upload-fab,.mobile-nav .upload-fab{width:clamp(52px,calc(var(--oc-viewport-w,390px) * .145),60px)!important;height:clamp(52px,calc(var(--oc-viewport-w,390px) * .145),60px)!important;top:calc((var(--oc-auto-nav-height) - clamp(52px,calc(var(--oc-viewport-w,390px) * .145),60px))/2)!important}

  /* Pricing remains fully usable for signed-in customers; its container reads the same gutter. */
  .pricing-page-shell .oc-container{width:calc(100% - max(var(--oc-auto-gutter),var(--oc-safe-left,0px)) - max(var(--oc-auto-gutter),var(--oc-safe-right,0px)))!important;max-width:1240px!important}
  .pricing-page-shell .oc-nav{gap:var(--oc-auto-gap)!important}
  .pricing-page-shell .oc-actions{gap:var(--oc-auto-gap)!important;min-width:0!important}

  /* Narrow phones keep the utility row legible without sacrificing control order. */
  html[data-oc-controls="compact"] .omvia-display-controls.omvia-mobile-utility-row .omvia-control-label{display:none!important}
  html[data-oc-controls="compact"] .omvia-display-controls.omvia-mobile-utility-row .omvia-plan-control{padding:0!important}
}

@media(max-width:359px){
  .omvia-display-controls.omvia-mobile-utility-row{gap:7px!important}
  .ref-top-actions .ref-avatar-button,.gallery-top-actions .gallery-account{display:none!important}
  .ref-mobile-nav a span,.gallery-mobile-nav a span,.mobile-nav a span{font-size:8.8px!important}
}

@media(min-width:961px){
  .omvia-display-controls.omvia-desktop-utility{margin-left:2px}
  .omvia-display-controls.omvia-desktop-utility .omvia-plan-control{min-width:74px!important}
}

/* The approved immersive viewer remains full-screen and is not padded by the adaptive shell. */
.media-immersive-page .omvia-display-controls{display:none!important}

/* Signed-in plan section actions remain compact and aligned. */
.account-plan-actions{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--oc-auto-gap,10px);margin-top:14px}
.account-plan-actions .account-action{width:100%!important;min-width:0!important;justify-content:center!important;text-align:center!important;white-space:normal!important}
@media(max-width:380px){.account-plan-actions{grid-template-columns:1fr}}
.omvia-display-controls .omvia-universal-lang{position:static!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;inset:auto!important;z-index:auto!important;transform:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}

@media(max-width:960px){.omvia-display-controls.omvia-mobile-utility-row{row-gap:8px!important;column-gap:8px!important}.omvia-display-controls.omvia-mobile-utility-row .lang-toggle .lang-code{font-size:11px!important}.omvia-display-controls.omvia-mobile-utility-row>*{border-radius:16px!important}}