/* CEOBI unified mobile-first layout */
:root{
  --ceobi-safe-top:env(safe-area-inset-top,0px);
  --ceobi-safe-right:env(safe-area-inset-right,0px);
  --ceobi-safe-bottom:env(safe-area-inset-bottom,0px);
  --ceobi-safe-left:env(safe-area-inset-left,0px);
  --ceobi-mobile-header:64px;
  --ceobi-mobile-bottom:70px;
  --ceobi-mobile-gutter:14px;
  --ceobi-mobile-bg:#08263a;
  --ceobi-mobile-bg-2:#0b3448;
  --ceobi-mobile-surface:#0d3147;
  --ceobi-mobile-surface-2:#104157;
  --ceobi-mobile-line:rgba(117,205,203,.24);
  --ceobi-mobile-text:#f3f9fa;
  --ceobi-mobile-muted:#b7ccd3;
  --ceobi-mobile-accent:#45c7bd;
  --ceobi-mobile-gold:#d5b461;
}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;overflow-x:hidden}
*,*::before,*::after{box-sizing:border-box}
body{min-width:0;max-width:100vw;overflow-x:hidden}
img,svg,canvas,video{max-width:100%;height:auto}
main,section,article,aside,nav,header,footer,div{min-width:0}
.ceobi-mobile-nav-toggle,.ceobi-mobile-bottom-nav,.ceobi-mobile-nav-backdrop{display:none}
.ceobi-mobile-hide-legacy{display:none!important}

@media(max-width:820px){
  html,body{width:100%;min-height:100%;overflow-x:hidden!important}
  body{
    padding-top:var(--ceobi-safe-top)!important;
    padding-bottom:calc(var(--ceobi-mobile-bottom) + var(--ceobi-safe-bottom) + 16px)!important;
    color:var(--ceobi-mobile-text)!important;
    background:
      radial-gradient(circle at 18% 12%,rgba(31,153,157,.24),transparent 34%),
      radial-gradient(circle at 88% 68%,rgba(41,122,151,.2),transparent 32%),
      linear-gradient(155deg,var(--ceobi-mobile-bg),#0a3044 55%,#0b4653)!important;
    background-attachment:fixed!important;
  }
  body::before{
    content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;opacity:.34;
    background:repeating-radial-gradient(ellipse at 35% 45%,transparent 0 42px,rgba(99,213,205,.07) 44px 46px,transparent 48px 90px)
  }
  body::after{opacity:.18!important}

  :is(.site-header,.m18-header,.executive-header,.ceobi-library-header,header[role="banner"]){
    position:sticky!important;top:0!important;z-index:9000!important;
    min-height:var(--ceobi-mobile-header)!important;
    padding-top:0!important;
    padding-inline:calc(var(--ceobi-safe-left) + 12px) calc(var(--ceobi-safe-right) + 12px)!important;
    background:linear-gradient(135deg,rgba(8,38,58,.98),rgba(10,58,75,.98))!important;
    border-bottom:1px solid var(--ceobi-mobile-line)!important;
    box-shadow:0 8px 24px rgba(2,17,27,.18)!important;
    backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)
  }
  .ceobi-library-header__inner{width:100%!important;min-height:var(--ceobi-mobile-header)!important;padding-inline:0 58px!important;gap:10px!important}
  html[dir="ltr"] .ceobi-library-header__inner{padding-inline:58px 0!important}
  .ceobi-library-brand small,.desktop-only,.hide-mobile{display:none!important}
  .ceobi-library-brand img{width:34px!important;height:34px!important}
  .ceobi-library-brand strong{font-size:1rem!important;white-space:nowrap}
  .ceobi-library-actions{margin-inline-start:auto!important}
  .ceobi-library-actions a:not(.primary){display:none!important}

  .ceobi-mobile-nav-toggle{
    display:grid;place-items:center;position:fixed;z-index:10020;
    top:calc(var(--ceobi-safe-top) + 9px);inset-inline-start:9px;
    width:46px;height:46px;border:1px solid var(--ceobi-mobile-line);border-radius:15px;
    background:linear-gradient(145deg,#0c3b53,#0a2d44)!important;color:#fff!important;
    box-shadow:0 10px 28px rgba(1,16,25,.28);font-size:0;touch-action:manipulation
  }
  .ceobi-mobile-nav-toggle::before{content:"☰";font-size:25px;line-height:1}
  .ceobi-mobile-nav-toggle[aria-expanded="true"]::before{content:"×";font-size:31px}
  .ceobi-mobile-nav-backdrop{position:fixed;z-index:10000;inset:0;background:rgba(3,25,36,.62);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
  body.ceobi-mobile-nav-open{overflow:hidden!important;touch-action:none}
  body.ceobi-mobile-nav-open .ceobi-mobile-nav-backdrop{display:block}

  :is(.sidebar,.admin-sidebar,.admin-side-nav,.admin-rail,.side-nav,.navigation-sidebar,.dashboard-sidebar,.m18-sidebar,.console-sidebar,[data-sidebar]){
    position:fixed!important;z-index:10010!important;top:0!important;bottom:0!important;
    inset-inline-start:0!important;inset-inline-end:auto!important;width:min(88vw,340px)!important;max-width:340px!important;
    height:100dvh!important;padding:calc(var(--ceobi-safe-top) + 72px) 14px calc(var(--ceobi-safe-bottom) + 20px)!important;
    overflow-y:auto!important;overflow-x:hidden!important;background:linear-gradient(180deg,#092b41,#0b3b4d)!important;
    border-inline-end:1px solid var(--ceobi-mobile-line)!important;
    transform:translateX(calc(-100% - 20px))!important;transition:transform .24s ease!important;
    box-shadow:18px 0 55px rgba(1,15,24,.32)!important;visibility:hidden!important
  }
  html[dir="rtl"] :is(.sidebar,.admin-sidebar,.admin-side-nav,.admin-rail,.side-nav,.navigation-sidebar,.dashboard-sidebar,.m18-sidebar,.console-sidebar,[data-sidebar]){
    inset-inline-start:auto!important;inset-inline-end:0!important;transform:translateX(calc(100% + 20px))!important;
    border-inline-end:0!important;border-inline-start:1px solid var(--ceobi-mobile-line)!important;
    box-shadow:-18px 0 55px rgba(1,15,24,.32)!important
  }
  body.ceobi-mobile-nav-open :is(.sidebar,.admin-sidebar,.admin-side-nav,.admin-rail,.side-nav,.navigation-sidebar,.dashboard-sidebar,.m18-sidebar,.console-sidebar,[data-sidebar]){transform:translateX(0)!important;visibility:visible!important}

  :is(.admin-main,.main-content,.dashboard-main,.content-area,.page-content,.admin-content,.console-content,.m18-main,[data-main-content]){
    margin:0!important;padding:16px var(--ceobi-mobile-gutter)!important;width:100%!important;max-width:100%!important;overflow:visible!important
  }
  .ceobi-legacy-bottom-nav,.ceobi-mobile-hide-legacy{display:none!important}

  .ceobi-mobile-bottom-nav{
    display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:stretch;
    position:fixed;z-index:9500;inset-inline:0;bottom:0;min-height:calc(var(--ceobi-mobile-bottom) + var(--ceobi-safe-bottom));
    padding:7px calc(var(--ceobi-safe-right) + 8px) calc(var(--ceobi-safe-bottom) + 6px) calc(var(--ceobi-safe-left) + 8px);
    background:linear-gradient(180deg,rgba(8,38,58,.98),rgba(7,31,53,.99))!important;
    border-top:1px solid var(--ceobi-mobile-line)!important;box-shadow:0 -10px 28px rgba(2,17,27,.24)
  }
  .ceobi-mobile-bottom-nav a{
    min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
    padding:5px 2px;border-radius:12px;color:#b2cad2!important;text-decoration:none;font-size:.67rem!important;font-weight:700;line-height:1.15;text-align:center
  }
  .ceobi-mobile-bottom-nav a svg{width:21px;height:21px;stroke:currentColor;fill:none;stroke-width:2;flex:none}
  .ceobi-mobile-bottom-nav a[aria-current="page"]{background:rgba(69,199,189,.14)!important;color:#79ded5!important}

  h1{font-size:clamp(2rem,9vw,3rem)!important;line-height:1.2!important;letter-spacing:0!important;overflow-wrap:anywhere}
  h2{font-size:clamp(1.5rem,7vw,2.15rem)!important;line-height:1.3!important;overflow-wrap:anywhere}
  h3{font-size:clamp(1.12rem,5vw,1.45rem)!important;line-height:1.4!important;overflow-wrap:anywhere}
  p,li,dd,dt{font-size:1rem!important;line-height:1.8!important;overflow-wrap:anywhere}
  small,.muted,.subtitle,.description{font-size:.88rem!important;line-height:1.65!important;color:var(--ceobi-mobile-muted)!important}

  :is(.breadcrumb,.breadcrumbs,.page-breadcrumb,.knowledge-breadcrumb,[aria-label="breadcrumb"],[aria-label="مسار التنقل"]){
    display:flex!important;align-items:center!important;flex-wrap:nowrap!important;gap:8px!important;
    width:calc(100% - 2 * var(--ceobi-mobile-gutter))!important;max-width:100%!important;
    margin:14px var(--ceobi-mobile-gutter)!important;padding:12px 14px!important;
    overflow-x:auto!important;overflow-y:hidden!important;white-space:nowrap!important;
    color:var(--ceobi-mobile-muted)!important;
    background:linear-gradient(135deg,rgba(13,49,71,.96),rgba(16,65,87,.9))!important;
    border:1px solid var(--ceobi-mobile-line)!important;border-radius:16px!important;
    box-shadow:0 10px 24px rgba(2,17,27,.13)!important;-webkit-overflow-scrolling:touch
  }
  :is(.breadcrumb,.breadcrumbs,.page-breadcrumb,.knowledge-breadcrumb,[aria-label="breadcrumb"],[aria-label="مسار التنقل"])>*{flex:0 0 auto!important;color:inherit!important;background:transparent!important}
  :is(.breadcrumb,.breadcrumbs,.page-breadcrumb,.knowledge-breadcrumb,[aria-label="breadcrumb"],[aria-label="مسار التنقل"]) a{color:#9de3dc!important;text-decoration:none!important}

  :is(.tabs,.tab-list,.admin-tabs,.admin-nav,.page-tabs,.section-tabs,.toolbar-tabs,.m18-tabs,.console-tabs,[role="tablist"],[data-tabs]){
    display:flex!important;flex-wrap:nowrap!important;gap:8px!important;width:100%!important;max-width:100%!important;
    overflow-x:auto!important;overflow-y:hidden!important;padding:8px 2px 12px!important;white-space:nowrap!important;-webkit-overflow-scrolling:touch
  }
  :is(.tabs,.tab-list,.admin-tabs,.admin-nav,.page-tabs,.section-tabs,.toolbar-tabs,.m18-tabs,.console-tabs,[role="tablist"],[data-tabs])>*{flex:0 0 auto!important;min-height:42px!important}

  :is(.card,.panel,.admin-panel,.content-card,.resource-card,.tool-card,.report-card,.ceobi-library-card,.hero-card,.tool-item,.report-item,.knowledge-tool-card,.knowledge-tool-category-card){
    width:100%!important;max-width:100%!important;margin-inline:0!important;padding:18px!important;
    border:1px solid var(--ceobi-mobile-line)!important;border-radius:20px!important;
    background:linear-gradient(145deg,var(--ceobi-mobile-surface),var(--ceobi-mobile-surface-2))!important;
    color:var(--ceobi-mobile-text)!important;box-shadow:0 14px 34px rgba(2,17,27,.16)!important;overflow:hidden!important
  }
  :is(.knowledge-tool-card__content,.knowledge-tool-card__header,.knowledge-tool-card__features,.knowledge-tool-card__actions){background:transparent!important}
  :is(.knowledge-tool-card__title,.knowledge-tool-category-card__title){color:var(--ceobi-mobile-text)!important}
  :is(.knowledge-tool-card__description,.knowledge-tool-category-card__description){color:var(--ceobi-mobile-muted)!important}

  :is(.grid,.cards-grid,.admin-grid,.dashboard-grid,.metrics-grid,.kpi-grid,.tools-grid,.reports-grid,.knowledge-tools-grid,.knowledge-tools-categories){display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:16px!important;width:100%!important}
  :is(.page-header,.admin-header,.panel-header,.section-header,.toolbar,.admin-toolbar,.content-toolbar){display:flex!important;flex-wrap:wrap!important;gap:10px!important;align-items:flex-start!important;width:100%!important}

  .ceobi-broken-icon{display:grid!important;place-items:center!important;background:rgba(69,199,189,.12)!important;color:var(--ceobi-mobile-accent)!important;border:1px solid var(--ceobi-mobile-line)!important}
  .ceobi-broken-icon svg{display:block!important;width:24px!important;height:24px!important}

  input,select,textarea,button{font-size:16px!important;max-width:100%!important}
  input,select,textarea{min-height:46px!important;background:#0b2d43!important;color:var(--ceobi-mobile-text)!important;border-color:var(--ceobi-mobile-line)!important}
  button,.btn,a.button{min-height:46px!important;white-space:normal!important;line-height:1.35!important}

  .table-responsive{width:100%!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch}
  table{min-width:680px;max-width:none!important}
  :is(.modal,.dialog,.admin-modal,.drawer,.panel-dialog,[role="dialog"]){width:calc(100vw - 20px)!important;max-width:calc(100vw - 20px)!important;max-height:calc(100dvh - var(--ceobi-safe-top) - var(--ceobi-safe-bottom) - 20px)!important;margin:auto!important;overflow:auto!important;border-radius:20px!important}
}

@media(max-width:430px){
  :root{--ceobi-mobile-gutter:12px}
  .ceobi-mobile-nav-toggle{inset-inline-start:8px;top:calc(var(--ceobi-safe-top) + 8px)}
  .ceobi-water-hero{padding:24px 16px!important;border-radius:20px!important}
  .ceobi-shell,.page-shell,.public-page,.admin-page-mount{width:100%!important;max-width:100%!important;margin:0!important;padding-inline:12px!important}
  :is(.card,.panel,.admin-panel,.content-card,.resource-card,.tool-card,.report-card,.ceobi-library-card,.knowledge-tool-card){padding:16px!important;border-radius:18px!important}
}