/* Source and licensing information for the line(s) below can be found at https://zitounatakaful.com/themes/custom/customtheme/css/mobile-menu.css. */
/* Mobile menu (< 1024px). Desktop is untouched: everything hidden >= 1024px. */
.mm-overlay,.mm-drawer{display:none}

@media (max-width:1023.98px){
  :root{
    --mm-primary:var(--color-19,#00553D);
    --mm-primary-soft:var(--color-23,#DFEEF0);
    /* Link colours from the prototype (src/styles.css tokens). */
    --mm-fg:#19251F;
    --mm-muted:#51625A;
    --mm-border:#DAE4DF;
    --mm-surface:#F1F7F3;
    --mm-subtle:#F3F8F5;
    --mm-accent:#BEF1C4;
    --mm-bg:var(--white,#fff);
    --mm-font:var(--font-2,Mulish,sans-serif);
    --mm-dir:-1;
  }
  [dir=rtl]{--mm-dir:1}

  html.mm-lock,html.mm-lock body{overflow:hidden}

  .mm-drawer{font-family:var(--mm-font);color:var(--mm-fg);-webkit-tap-highlight-color:transparent}
  .mm-drawer *{box-sizing:border-box}
  .mm-drawer svg{flex:none;display:block}
  .mm-drawer a{text-decoration:none}
  .mm-drawer :focus-visible{outline:2px solid var(--mm-primary);outline-offset:2px}

  .mm-close{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:48px;min-height:48px;padding:0 6px;border:0;border-radius:8px;background:transparent;color:var(--mm-fg);font:inherit;font-size:15px;font-weight:600;cursor:pointer}
  .mm-close:hover{background:var(--mm-surface)}
  .mm-logo{display:flex;align-items:center;justify-content:center;height:44px}

  /* Overlay + drawer */
  .mm-overlay{display:block;position:fixed;inset:0;z-index:1050;background:rgba(10,25,22,.5);opacity:0;transition:opacity .25s ease}
  .mm-drawer{display:flex;flex-direction:column;position:fixed;inset-block:0;inset-inline-start:0;z-index:1060;width:min(400px,88vw);background:var(--mm-bg);box-shadow:0 10px 40px rgba(0,0,0,.2);transform:translateX(calc(100% * var(--mm-dir)));transition:transform .3s cubic-bezier(.2,.8,.2,1);will-change:transform}
  .mm-overlay[hidden],.mm-drawer[hidden]{display:none!important}
  html.mm-open .mm-overlay{opacity:1}
  html.mm-open .mm-drawer{transform:none}

  .mm-drawer__head{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-block-end:1px solid var(--mm-border);flex:none}
  .mm-logo--drawer img{height:36px;width:auto;max-width:132px;object-fit:contain}
  .mm-drawer__body{flex:1;display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior:contain}
  /* BO region "menu_mobile": menu block "Menu mobile" (grows), then HTML blocks (quick actions) stuck at the bottom. */
  .mm-drawer__body>.region{display:flex;flex-direction:column;flex:1 0 auto}
  .mm-drawer__body .menu--menu-mobile{flex:1 0 auto;padding:20px}
  .mm-drawer .block-block-content{position:sticky;bottom:0;flex:none;padding:16px 20px max(16px,env(safe-area-inset-bottom,0px));background:var(--mm-subtle);border-block-start:1px solid var(--mm-border)}

  /* Views (root + sub-panels) */
  .mm-view[hidden]{display:none}
  .mm-view.mm-fwd{animation:mm-fwd .24s ease both}
  .mm-view.mm-bwd{animation:mm-bwd .24s ease both}
  @keyframes mm-fwd{from{opacity:0;transform:translateX(calc(24px * var(--mm-dir) * -1))}to{opacity:1;transform:none}}
  @keyframes mm-bwd{from{opacity:0;transform:translateX(calc(24px * var(--mm-dir)))}to{opacity:1;transform:none}}

  /* Tabs Particuliers / Professionnels */
  .mm-tabs{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:4px;padding:4px;margin-block-end:24px;border-radius:12px;background:var(--mm-surface)}
  .mm-tab{min-height:44px;padding:6px 8px;border:0;border-radius:8px;background:transparent;color:var(--mm-fg);font:inherit;font-size:14px;font-weight:600;line-height:1.2;cursor:pointer}
  .mm-tab[aria-selected=true]{background:var(--mm-primary);color:#fff;box-shadow:0 1px 3px rgba(0,0,0,.15)}
  /* 2nd universe (Professionnels & Entreprises): aubergine when selected. */
  .mm-tab:nth-child(2)[aria-selected=true]{background:var(--color-14,#722657)}
  /* Its sub-panels (ids "mm-p2-…"): current category in aubergine. */
  .mm-view[id^="mm-p2-"] .mm-view__title,.mm-view[id^="mm-p2-"] .mm-all,.mm-view[id^="mm-p2-"] .mm-back:hover{color:var(--color-14,#722657)}

  /* Lists */
  .mm-list{display:grid;gap:4px;list-style:none;margin:0;padding:0}
  .mm-link{display:flex;width:100%;align-items:center;justify-content:space-between;gap:8px;min-height:56px;padding:8px 12px;border:0;border-radius:8px;background:transparent;color:var(--mm-fg);font:inherit;font-size:15px;font-weight:600;line-height:1.35;text-align:start;cursor:pointer;transition:background-color .16s ease,color .16s ease}
  .mm-link:hover,.mm-link.is-active{background:var(--mm-surface);color:var(--mm-fg)}
  .mm-link:active{background:var(--mm-accent)}
  .mm-chevron{width:16px;height:16px;color:var(--mm-muted);transition:transform .16s ease}
  /* Same chevron on plain links (secondary block, sub-panel items). */
  a.mm-link::after{content:"";flex:none;width:16px;height:16px;background:var(--mm-muted);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m9 6 6 6-6 6' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m9 6 6 6-6 6' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform .16s ease}
  .mm-link:hover .mm-chevron,a.mm-link:hover::after{transform:translateX(2px)}
  [dir=rtl] .mm-chevron,[dir=rtl] a.mm-link::after,[dir=rtl] .mm-back svg{transform:scaleX(-1)}
  [dir=rtl] .mm-link:hover .mm-chevron,[dir=rtl] a.mm-link:hover::after{transform:scaleX(-1) translateX(2px)}

  .mm-secondary{margin-block-start:24px;padding-block-start:20px;border-block-start:1px solid var(--mm-border)}
  .mm-label{margin:0 0 10px;padding:0;font-family:var(--mm-font);font-size:11px;font-weight:800;line-height:16px;letter-spacing:.12em;text-transform:uppercase;color:var(--mm-muted)}
  .mm-secondary .mm-list{gap:0}
  .mm-secondary .mm-link{min-height:48px;padding-block:0;font-size:14px;color:var(--mm-muted)}
  .mm-secondary .mm-link:hover,.mm-secondary .mm-link.is-active{background:var(--mm-surface);color:var(--mm-fg)}

  /* Sub-panel header: back arrow + parent title on one line ("Retour" kept for screen readers). */
  .mm-view[data-mm-parent]:not([hidden]){display:flex;flex-wrap:wrap;align-items:center;align-content:flex-start}
  .mm-view[data-mm-parent]>*{flex-basis:100%}
  .mm-view[data-mm-parent]>.mm-back{flex:none}
  .mm-view[data-mm-parent]>.mm-view__title{flex:1;min-width:0}
  .mm-back{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;padding:0;margin:0;margin-inline-end:4px;border:0;border-radius:8px;background:transparent;color:var(--mm-muted);cursor:pointer;transition:background-color .16s ease,color .16s ease}
  .mm-back:hover{background:var(--mm-surface);color:var(--mm-primary)}
  .mm-back span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .mm-view__title{margin:0;padding:0;font-family:var(--mm-font);font-size:18px;font-weight:700;line-height:1.35;color:var(--mm-primary);outline:0}
  .mm-view[data-mm-parent]>.mm-list{margin-block-start:12px}
  .mm-view[data-mm-parent] .mm-link{min-height:48px;padding-block:6px}
  .mm-all{display:flex;align-items:center;min-height:44px;padding-inline:12px;color:var(--mm-primary);font-size:14px;font-weight:700;text-decoration:underline!important}

  /* Quick actions: BO HTML block in region "menu_mobile" (icons only, label read by screen readers). */
  .mm-drawer .block-block-content>h2{margin:0 0 10px;padding:0;font-family:var(--mm-font);font-size:11px;font-weight:800;line-height:16px;letter-spacing:.12em;text-transform:uppercase;color:var(--mm-muted)}
  .mm-drawer .block-block-content p{margin:0}
  .mm-drawer .block-block-content ul{display:flex;gap:8px;list-style:none;margin:0;padding:0}
  .mm-drawer .block-block-content li{flex:1 1 0;min-width:0;margin:0;padding:0}
  .mm-drawer .block-block-content li::before{content:none}
  .mm-drawer .block-block-content li a{display:flex;align-items:center;justify-content:center;min-width:48px;min-height:48px;padding:8px;border:1px solid var(--mm-border);border-radius:8px;background:var(--mm-bg);color:var(--mm-primary);transition:background-color .16s ease,transform .12s ease}
  .mm-drawer .block-block-content li a:hover{background:var(--mm-surface);color:var(--mm-primary)}
  .mm-drawer .block-block-content li a:active{transform:scale(.97)}
  .mm-drawer .block-block-content li a.is-primary{background:var(--mm-primary);border-color:var(--mm-primary);color:#fff}
  .mm-drawer .block-block-content li a.is-primary:hover{background:color-mix(in srgb,var(--mm-primary) 90%,#000);color:#fff}
  .mm-drawer .block-block-content li a img{display:block;width:auto;max-width:100%;height:26px;object-fit:contain}
  .mm-drawer .block-block-content li a .ph{font-size:0;line-height:0;color:inherit}
  .mm-drawer .block-block-content li a .ph::before{font-size:22px;line-height:1}

}

@media (max-width:419.98px){
  .mm-drawer{width:100%}
}
@media (prefers-reduced-motion:reduce){
  .mm-overlay,.mm-drawer{transition:none!important}
  .mm-view.mm-fwd,.mm-view.mm-bwd{animation:none!important}
}

/* Source and licensing information for the above line(s) can be found at https://zitounatakaful.com/themes/custom/customtheme/css/mobile-menu.css. */