/* Espace client habillé comme les sites du thème « ocak » (kebab turc traditionnel : carreaux d'Iznik, arche ottomane, nazar, bleu et grenade, sans néon).
   Chargé après admin.css ; les polices viennent de templates/themes/ocak/fonts (route /<slug>/fonts/). */
@font-face{font-family:"Bricolage";src:url(fonts/bricolage.woff2) format("woff2");font-weight:400 800;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC}
@font-face{font-family:"Bricolage";src:url(fonts/bricolage-ext.woff2) format("woff2");font-weight:400 800;font-display:swap;unicode-range:U+0100-02BA,U+1E00-1EFF}
:root[data-gabarit="ocak"]{
  --cobalt:#1f3f94;--turquoise:#17a2a0;--safran:#f6b51e;--gece:#1a2c66;--email:#fbf8f2;--sut:#f4ecdf;--sable:#e9dcc6;
  --ground:var(--sut);--surface:var(--email);--surface-2:var(--sable);--ink:#1b1512;--ink-soft:#3a302a;--muted:#6d6158;
  --line:color-mix(in srgb,#1b1512 13%,transparent);--accent:var(--p);--accent-ink:color-mix(in srgb,var(--p) 78%,#000);
  --shadow:0 1px 0 rgba(27,21,18,.08),0 16px 34px -18px rgba(27,21,18,.3);--shadow-hover:0 1px 0 rgba(27,21,18,.08),0 28px 44px -20px rgba(27,21,18,.42);
  --neon:var(--titre);--titre:"Bricolage","Segoe UI",system-ui,sans-serif;
  --font:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;--titres:var(--titre);--sans:var(--font);
  --cini:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80'%3E%3Crect width='80' height='80' fill='%23fbf8f2'/%3E%3Cg fill='%231f3f94'%3E%3Cpath d='M0 0h22a22 22 0 0 1-22 22z'/%3E%3Cpath d='M80 0H58a22 22 0 0 0 22 22z'/%3E%3Cpath d='M0 80h22a22 22 0 0 0-22-22z'/%3E%3Cpath d='M80 80H58a22 22 0 0 1 22-22z'/%3E%3C/g%3E%3Cpath fill='%2317a2a0' d='M40 16l6 13 13-6-6 13 13 6-13 6 6 13-13-6-6 13-6-13-13 6 6-13-13-6 13-6-6-13 13 6z'/%3E%3Ccircle cx='40' cy='42' r='6.5' fill='%23c62828'/%3E%3Cg fill='%23c62828'%3E%3Cpath d='M40 0c-4 4-4 8 0 10 4-2 4-6 0-10z'/%3E%3Cpath d='M40 80c-4-4-4-8 0-10 4 2 4 6 0 10z'/%3E%3Cpath d='M0 40c4-4 8-4 10 0-2 4-6 4-10 0z'/%3E%3Cpath d='M80 40c-4-4-8-4-10 0 2 4 6 4 10 0z'/%3E%3C/g%3E%3Cg fill='none' stroke='%231f3f94' stroke-width='1.4'%3E%3Ccircle cx='40' cy='42' r='22'/%3E%3C/g%3E%3C/svg%3E");
  color-scheme:light;
}
[data-gabarit="ocak"] body{background:var(--sut);-webkit-font-smoothing:antialiased}
[data-gabarit="ocak"] h1{font-family:var(--titre);font-weight:800;letter-spacing:-.025em}
[data-gabarit="ocak"] h1 em,[data-gabarit="ocak"] h2 em,[data-gabarit="ocak"] .rendu-titre em{font-style:normal;color:var(--p)}

/* petite ligne au-dessus des titres : trois carreaux, comme sur le site */
[data-gabarit="ocak"] .sur{display:inline-flex;align-items:center;gap:10px;letter-spacing:.2em}
[data-gabarit="ocak"] .sur::before{content:"";width:48px;height:16px;background:var(--cini) 0 0/16px 16px repeat-x;border-radius:3px;box-shadow:0 0 0 1px var(--line)}
[data-gabarit="ocak"] .sur:empty{display:none}

/* en-tête : nuit, frise d'Iznik, nom au néon */
[data-gabarit="ocak"] .a-hd{background:color-mix(in srgb,var(--sut) 92%,transparent);color:var(--ink)}
[data-gabarit="ocak"] .a-auvent{display:block;height:18px;background:var(--cini) center/18px 18px repeat-x}
[data-gabarit="ocak"] .a-hd-in{height:64px}
[data-gabarit="ocak"] .a-nom{font:800 22px/1 var(--titre);letter-spacing:-.02em;color:var(--ink)}

[data-gabarit="ocak"] .a-voir{background:var(--p);color:#fff!important;border-radius:10px;padding:10px 16px;font-weight:800}
[data-gabarit="ocak"] .fil{top:82px;background:linear-gradient(var(--sut) 80%,transparent)}
[data-gabarit="ocak"] .retour{background:var(--gece);color:var(--email)}
[data-gabarit="ocak"] .puces-a button{background:var(--email);font-weight:600}
[data-gabarit="ocak"] .puces-a button[aria-current]{background:var(--cobalt);border-color:var(--cobalt);color:#fff}
[data-gabarit="ocak"] .popup-apercu{top:150px}

/* boutons : enseignes */
[data-gabarit="ocak"] .btn{border-radius:10px;font-family:var(--titre);font-weight:800;box-shadow:0 10px 24px -8px color-mix(in srgb,var(--p) 55%,transparent)}
[data-gabarit="ocak"] .btn-primary{background:var(--p);color:#fff}
[data-gabarit="ocak"] .btn-primary:hover{background:var(--accent-ink)}
[data-gabarit="ocak"] .mini{background:var(--email);border-radius:8px}
[data-gabarit="ocak"] input[type=text],[data-gabarit="ocak"] input[type=email],[data-gabarit="ocak"] input[type=tel],
[data-gabarit="ocak"] input[type=url],[data-gabarit="ocak"] input[type=password],[data-gabarit="ocak"] input[type=date],
[data-gabarit="ocak"] textarea,[data-gabarit="ocak"] select{background:#fff;border-radius:10px}
[data-gabarit="ocak"] .bloc{border-radius:16px;border-color:transparent}

/* accueil : chaque vignette reprend l'ambiance de sa rubrique */
[data-gabarit="ocak"] .accueil-tete h1{font-size:clamp(38px,6.4vw,64px)}
[data-gabarit="ocak"] .tuile{border:0;border-radius:16px;min-height:210px;overflow:hidden}
[data-gabarit="ocak"] .t-num{font:800 32px/1 var(--titre);color:var(--p)}
[data-gabarit="ocak"] .t-titre{font:800 25px/1.05 var(--titre);letter-spacing:-.01em}
[data-gabarit="ocak"] .t-haut{background:var(--gece);color:var(--email)}
[data-gabarit="ocak"] .t-haut .t-resume{color:rgba(251,248,242,.7)}
[data-gabarit="ocak"] .t-haut .t-titre{font:800 28px/1 var(--titre);color:#fff;}
[data-gabarit="ocak"] .t-haut .t-num,[data-gabarit="ocak"] .t-haut .t-go{color:#f2c14e}
[data-gabarit="ocak"] .t-haut .t-img,[data-gabarit="ocak"] .t-apropos .t-img{inset:14px 14px auto auto;width:34%;height:calc(100% - 28px);border-radius:12px;overflow:hidden}
[data-gabarit="ocak"] .t-apropos .t-img{border-radius:50% 50% 12px 12px / 30% 30% 12px 12px}
[data-gabarit="ocak"] .t-haut .t-img img,[data-gabarit="ocak"] .t-apropos .t-img img{-webkit-mask:none;mask:none}
[data-gabarit="ocak"] .t-haut .t-titre,[data-gabarit="ocak"] .t-haut .t-resume,
[data-gabarit="ocak"] .t-apropos .t-titre,[data-gabarit="ocak"] .t-apropos .t-resume{max-width:60%}
[data-gabarit="ocak"] .t-menus{background:var(--email);box-shadow:inset 0 0 0 10px transparent;border:10px solid transparent;border-image:var(--cini) 0 round;border-image-width:10px}
[data-gabarit="ocak"] .t-menus::after{content:"Bugün";position:absolute;top:16px;right:16px;font:800 13px/1 var(--neon);letter-spacing:.14em;text-transform:uppercase;
  background:var(--p);color:#fff;border-radius:6px;padding:6px 8px;transform:rotate(7deg)}
[data-gabarit="ocak"] .t-carte{background:var(--email)}
[data-gabarit="ocak"] .t-services{background:var(--sable)}
[data-gabarit="ocak"] .t-galerie .t-mini img{border-radius:10px;width:60px;height:60px;box-shadow:0 0 0 3px var(--email),0 6px 14px -6px rgba(0,0,0,.35)}
[data-gabarit="ocak"] .t-galerie .t-mini img:nth-child(2){transform:rotate(-4deg)}
[data-gabarit="ocak"] .t-galerie .t-mini img:nth-child(3){transform:rotate(3deg)}
[data-gabarit="ocak"] .t-infos{background:var(--email);position:relative}
[data-gabarit="ocak"] .t-infos::before{content:"";position:absolute;top:0;left:0;right:0;height:14px;background:var(--cini) 0 0/14px 14px repeat-x}
[data-gabarit="ocak"] .t-popup{background:var(--p);color:#fff}
[data-gabarit="ocak"] .t-popup .t-num,[data-gabarit="ocak"] .t-popup .t-go,[data-gabarit="ocak"] .t-popup .t-resume{color:#fff}
[data-gabarit="ocak"] .t-popup .t-etat{background:rgba(255,255,255,.2);color:#fff}
[data-gabarit="ocak"] .t-popup .t-etat.on{background:#fff;color:#1f8a4c}
[data-gabarit="ocak"] .tuile-sec{border-color:color-mix(in srgb,var(--ink) 25%,transparent)}

/* aperçus dans le haut de la page (badge, bandeau) */
[data-gabarit="ocak"] .a-pastille{position:relative;flex:none;width:130px;height:130px;border-radius:50%;color:#fff;display:grid;place-items:center;
  background:radial-gradient(circle,#0d0f1e 0 12%,#5fb7e8 12.5% 25%,#fff 25.5% 37%,#1d4fb8 37.5% 100%);box-shadow:0 12px 26px rgba(0,0,0,.25)}
[data-gabarit="ocak"] .a-pastille svg{position:absolute;inset:0;width:100%;height:100%;animation:a-tourne 22s linear infinite}
[data-gabarit="ocak"] .a-pastille text{font:700 9.5px var(--font);letter-spacing:.2em;text-transform:uppercase;fill:#fff}
[data-gabarit="ocak"] .a-pastille b{position:absolute;bottom:-4px;right:-4px;font:800 18px/1 var(--titre);background:var(--p);color:#fff;padding:5px 8px;border-radius:6px;transform:rotate(-6deg)}
@keyframes a-tourne{to{transform:rotate(360deg)}}
[data-gabarit="ocak"] .pastille-zone{display:flex;gap:22px;align-items:center;flex-wrap:wrap}
[data-gabarit="ocak"] .a-defile{background:var(--p);color:#fff;border-radius:10px;overflow:hidden;padding:12px 0;margin:0 0 14px}
[data-gabarit="ocak"] .a-defile div{display:flex;flex-wrap:nowrap;white-space:nowrap}
[data-gabarit="ocak"] .a-defile span{font:800 22px/1 var(--titre);padding:0 16px;display:flex;align-items:center;gap:28px}
[data-gabarit="ocak"] .a-defile span::after{content:"";width:16px;height:16px;background:var(--cini) center/16px;border-radius:3px}
@media(prefers-reduced-motion:reduce){[data-gabarit="ocak"] .a-pastille svg{animation:none}}

/* menu de la semaine : un carreau d'Iznik par jour */
[data-gabarit="ocak"] .bloc-semaine{background:var(--email)}
[data-gabarit="ocak"] .a-ticket{background:var(--email);border:10px solid transparent;border-image:var(--cini) 0 round;border-image-width:10px;border-radius:0;box-shadow:0 16px 30px -18px rgba(27,21,18,.4)}
[data-gabarit="ocak"] .a-ticket .jour{padding:16px 16px 12px;text-align:center;border-bottom:2px dotted color-mix(in srgb,var(--cobalt) 40%,transparent)}
[data-gabarit="ocak"] .a-ticket .jour b{font:800 28px/1 var(--titre);color:var(--cobalt)}
[data-gabarit="ocak"] .a-ticket textarea{padding:14px 16px 4px;background:transparent}
[data-gabarit="ocak"] .a-ticket.oggi{background:var(--p);color:#fff;box-shadow:0 22px 36px -16px rgba(198,40,40,.5);transform:rotate(-.6deg)}
[data-gabarit="ocak"] .a-ticket.oggi .jour b{color:#fff;}
[data-gabarit="ocak"] .a-ticket.oggi .jour small{color:rgba(255,255,255,.85)}
[data-gabarit="ocak"] .a-ticket.oggi textarea{color:#fff}
[data-gabarit="ocak"] .a-ticket.oggi textarea::placeholder{color:rgba(255,255,255,.6)}
[data-gabarit="ocak"] .a-ticket.oggi .tampon{color:#fff;background:var(--cobalt);border-color:var(--cobalt)}

/* autres menus : plaques lumineuses */
[data-gabarit="ocak"] .a-ardoise{background:var(--email);color:var(--ink);border-radius:14px;box-shadow:0 0 0 4px var(--email),0 0 0 6px var(--cobalt);padding:18px 18px 12px}
[data-gabarit="ocak"] .a-ardoise .ch{color:var(--muted)}
[data-gabarit="ocak"] .a-ardoise input,[data-gabarit="ocak"] .a-ardoise textarea{background:#fff}
[data-gabarit="ocak"] .a-ardoise .craie-titre input{font:800 26px/1.1 var(--titre);color:var(--cobalt)}

/* la carte : panneau lumineux, prix safran */
[data-gabarit="ocak"] .a-rayon{background:var(--email);border:0;border-radius:16px;box-shadow:0 1px 0 var(--line);position:relative;overflow:hidden;padding-top:26px}
[data-gabarit="ocak"] .a-rayon::before{content:"";position:absolute;top:0;left:0;right:0;height:12px;background:var(--cini) 0 0/12px 12px repeat-x}
[data-gabarit="ocak"] .r-nom{font:800 24px/1 var(--titre)}
[data-gabarit="ocak"] .prod{background:#fff;border:0;box-shadow:0 1px 0 var(--line)}
[data-gabarit="ocak"] .prod .p-prix{font:800 19px/1.1 var(--titre);color:var(--p);text-align:right}

/* prestations */
[data-gabarit="ocak"] .a-formule{background:var(--email);border-radius:14px}
[data-gabarit="ocak"] .f-num{font:800 44px/1 var(--titre);color:var(--p)}

/* galerie */
[data-gabarit="ocak"] .photo{border:0;border-radius:12px;background:#fff;box-shadow:0 1px 0 var(--line)}
[data-gabarit="ocak"] .ph-num{background:var(--cobalt);color:#fff}

/* connexion : carte de nuit avec frise */
[data-gabarit="ocak"] .connexion{position:relative;overflow:hidden;padding-top:42px}
[data-gabarit="ocak"] .connexion::before{content:"";position:absolute;top:0;left:0;right:0;height:18px;background:var(--cini) 0 0/18px 18px repeat-x}
[data-gabarit="ocak"] .connexion h1{font:800 36px/1 var(--titre)}

/* barre d'enregistrement */
[data-gabarit="ocak"] .barre{background:color-mix(in srgb,var(--sut) 92%,transparent)}

/* Pop-up d'annonce du thème ocak (business.json → "popup") : carte émaillée crème bordée de carreaux d'Iznik.
   Inclus dans le site par ocak.html.j2 et repris tel quel par l'espace client pour l'aperçu en direct.
   Utilise les variables du thème : --p, --p2, --cini, --cobalt, --email, --sut, --ink, --muted, --titre, --sans. */
.pop{position:fixed;inset:0;z-index:95;display:grid;place-items:center;padding:16px}
.pop[hidden]{display:none}
.pop-fond{position:absolute;inset:0;background:rgba(26,44,102,.55);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);animation:pop-fondu .35s ease both}
.pop-carte{position:relative;width:min(100%,440px);max-height:calc(100dvh - 32px);overflow:auto;background:var(--email);color:var(--ink);
  border-radius:16px;box-shadow:0 0 0 4px var(--email),0 0 0 6px var(--cobalt),0 40px 80px -24px rgba(0,0,0,.55);
  animation:pop-arrivee .6s cubic-bezier(.2,.9,.25,1.15) both;scrollbar-width:none}
.pop-carte::-webkit-scrollbar{display:none}
.pop-frise{height:22px;background:var(--cini) center/22px 22px repeat-x}
.pop-x{position:absolute;top:32px;right:12px;z-index:3;width:40px;height:40px;border-radius:10px;border:0;cursor:pointer;
  background:var(--cobalt);color:#fff;font:700 26px/1 var(--sans);display:grid;place-items:center;box-shadow:0 6px 16px rgba(0,0,0,.25);transition:transform .2s}
.pop-x:hover{transform:rotate(90deg)}
/* image toujours entière, jamais recadrée (affiches avec du texte) ; place réservée à droite pour la croix */
.pop-img{position:relative;margin:16px 62px 0 18px;display:flex;justify-content:center}
.pop-img img{display:block;width:auto;max-width:100%;height:auto;max-height:55dvh;object-fit:contain;border-radius:10px;box-shadow:0 0 0 1px var(--line)}
.pop-tampon{display:inline-block;font:800 13px/1 var(--titre);letter-spacing:.08em;text-transform:uppercase;background:var(--p);color:#fff;
  padding:8px 11px;border-radius:6px;transform:rotate(-5deg);box-shadow:0 6px 14px rgba(0,0,0,.2)}
.pop-img .pop-tampon{position:absolute;left:-6px;bottom:-12px}
.pop-txt{padding:26px;text-align:center}
.pop-sur{font:700 12px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--p);margin:4px 0 12px}
.pop-txt h2{font:800 clamp(32px,8vw,44px)/.95 var(--titre);letter-spacing:-.03em;margin:0 0 12px}
.pop-txt h2 em{font-style:normal;color:var(--p)}
.pop-txt p{margin:0 0 10px;color:var(--muted);font-size:16.5px}
.pop-btn,.pop-merci{display:inline-flex;margin-top:12px;font:800 16.5px/1 var(--titre);text-decoration:none;padding:15px 24px;border-radius:10px;border:0;cursor:pointer;
  background:var(--p);color:#fff;box-shadow:0 10px 24px -10px color-mix(in srgb,var(--p) 70%,transparent)}
.pop-merci{background:var(--cobalt)}
.pop.sortie .pop-carte{animation:pop-depart .24s ease both}
.pop.sortie .pop-fond{animation:pop-fondu .24s ease reverse both}
@keyframes pop-fondu{from{opacity:0}}
@keyframes pop-arrivee{from{opacity:0;transform:translateY(30px) scale(.94)}}
@keyframes pop-depart{to{opacity:0;transform:translateY(16px) scale(.97)}}
@media(prefers-reduced-motion:reduce){.pop-carte,.pop-fond{animation:none}}