/* ═══════════════════════════════════════════════════
   THÈME OCÉAN LUMINEUX + COMPOSANTS VISUELS
   theme.css — styles additionnels et thème clair
═══════════════════════════════════════════════════ */
/* ═══ THÈME OCÉAN LUMINEUX ═══ */
body.ocean-light {
  --abyss:    #bce8f5; --deep:     #a8dcee; --mid:      #90d0e8;
  --surface:  #76c6e0; --panel:    #b4e2f2; --panel2:   #9fd5ea;
  --border:   #7acde0; --border2:  #3ab0cc;
  --cyan:     #0077aa; --cyan-dim: #005f8a;
  --teal:     #007a6a; --teal-dim: #005a4d;
  --green:    #007a3d; --green-dim:#005a2d;
  --amber:    #b06000; --red:      #cc2222;
  --foam:     #003850; --foam-dim: #1a5570;
  --text:     #002a3a; --text-dim: #1a5060;
  --muted:    #2a7090;
  --glow-c:   rgba(0,119,170,0.12); --glow-t: rgba(0,122,106,0.10);
}
body.ocean-light { background: linear-gradient(160deg, #9ed4ea 0%, #b4e2f2 40%, #88c8e0 100%); }
body.ocean-light::after { background: repeating-linear-gradient(0deg,transparent,transparent 3px,rgba(0,119,170,0.025) 3px,rgba(0,119,170,0.025) 4px); }
body.ocean-light::before { background: radial-gradient(ellipse at center,transparent 55%,rgba(160,220,240,0.5) 100%); }
body.ocean-light nav { background:rgba(155,215,240,0.92); border-bottom-color:#7acde0; box-shadow:0 1px 20px rgba(0,119,170,0.12); }
body.ocean-light .card { box-shadow:inset 0 0 30px rgba(160,220,240,0.3),0 2px 8px rgba(0,100,150,0.08); }
body.ocean-light .card:hover { box-shadow:0 0 20px rgba(0,119,170,0.12),inset 0 0 30px rgba(160,220,240,0.3); }
body.ocean-light .statusbar { background:#9fd5ea; border-top-color:#7acde0; }
body.ocean-light .ff input, body.ocean-light .ff textarea { background:#bce8f5; border-color:#7acde0; color:#002a3a; }
body.ocean-light .ff input::placeholder, body.ocean-light .ff textarea::placeholder { color:#5a9aaa; }
body.ocean-light .cvb { box-shadow:inset 0 0 30px rgba(160,220,240,0.3); }
body.ocean-light ::-webkit-scrollbar-track { background:var(--deep); }
body.ocean-light ::-webkit-scrollbar-thumb { background:var(--border2); }

/* Bouton toggle */
#theme-toggle {
  margin-left:auto; flex-shrink:0; background:none;
  border:1px solid var(--border); border-radius:20px; cursor:pointer;
  display:flex; align-items:center; gap:6px; padding:4px 12px 4px 8px;
  font-family:'Share Tech Mono',monospace; font-size:0.62rem;
  color:var(--muted); letter-spacing:0.06em; transition:color .2s,border-color .2s,background .2s;
  white-space:nowrap;
}
#theme-toggle:hover { border-color:var(--cyan-dim); color:var(--cyan); background:rgba(0,229,255,0.05); }
body.ocean-light #theme-toggle:hover { background:rgba(0,119,170,0.07); }
.theme-icon { font-size:14px; line-height:1; transition:transform .4s cubic-bezier(.34,1.56,.64,1); }
#theme-toggle:hover .theme-icon { transform:rotate(20deg) scale(1.15); }

/* Loader */
#page-loader { position:fixed;inset:0;z-index:99999; background:linear-gradient(160deg,#9ed4ea 0%,#b4e2f2 40%,#88c8e0 100%); display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.5rem; transition:opacity .5s ease,visibility .5s ease; }
body:not(.ocean-light) #page-loader { background:linear-gradient(160deg,#020d14 0%,#04182a 60%,#062840 100%); }
#page-loader.hidden { opacity:0;visibility:hidden;pointer-events:none; }
.loader-fish { animation:bloupi-float 1s ease-in-out infinite alternate; }
.loader-text { font-family:'Orbitron',monospace;font-size:0.75rem;letter-spacing:0.25em;color:#007a6a;animation:blink 1.2s ease-in-out infinite; }
body:not(.ocean-light) .loader-text { color:#00c9aa; }
.loader-bubbles { display:flex;gap:8px;align-items:flex-end;height:20px; }
.loader-bubbles span { width:6px;height:6px;border-radius:50%;background:#00c9aa;opacity:0.7;animation:loader-bounce .8s ease-in-out infinite; }
body.ocean-light .loader-bubbles span { background:#007a6a; }
.loader-bubbles span:nth-child(2){animation-delay:.15s} .loader-bubbles span:nth-child(3){animation-delay:.30s}
@keyframes loader-bounce { 0%,80%,100%{transform:scaleY(0.5);opacity:.4} 40%{transform:scaleY(1.4);opacity:1} }

/* Curseur */
* { cursor:none !important; }
#custom-cursor { position:fixed;pointer-events:none;z-index:999999;top:0;left:0;transform:translate(-50%,-50%); }
#cursor-dot { width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 8px var(--cyan),0 0 16px rgba(0,229,255,0.3);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);transition:width .15s,height .15s,background .15s; }
#cursor-ring { width:28px;height:28px;border-radius:50%;border:1px solid rgba(0,229,255,0.45);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);animation:cursor-sonar 2.5s ease-out infinite; }
@keyframes cursor-sonar { 0%{box-shadow:0 0 0 0 rgba(0,229,255,0.25)} 70%{box-shadow:0 0 0 8px rgba(0,229,255,0)} 100%{box-shadow:0 0 0 0 rgba(0,229,255,0)} }
body.cursor-pointer #cursor-dot { width:12px;height:12px;background:var(--teal);box-shadow:0 0 12px var(--teal); }
body.cursor-pointer #cursor-ring { width:38px;height:38px;border-color:rgba(0,201,170,0.6); }
@media(max-width:768px){ *{cursor:auto !important;} #custom-cursor{display:none;} }

/* Open to work */
.otw-badge { display:inline-flex;align-items:center;gap:7px;background:rgba(57,255,136,0.1);border:1px solid rgba(57,255,136,0.35);border-radius:20px;padding:5px 14px 5px 10px;font-size:0.68rem;color:#39ff88;letter-spacing:0.08em;margin-bottom:1.1rem;font-family:'Share Tech Mono',monospace;position:relative;animation:otw-badge-glow 2.5s ease-in-out infinite; }
body.ocean-light .otw-badge { background:rgba(0,122,60,0.1);border-color:rgba(0,122,60,0.35);color:#006830;animation:otw-badge-glow-light 2.5s ease-in-out infinite; }
.otw-dot { width:8px;height:8px;border-radius:50%;background:#39ff88;box-shadow:0 0 6px #39ff88;animation:otw-pulse 1.8s ease-in-out infinite;flex-shrink:0; }
body.ocean-light .otw-dot { background:#006830;box-shadow:0 0 6px rgba(0,104,48,0.5); }
@keyframes otw-pulse { 0%,100%{transform:scale(1);opacity:1} 50%{transform:scale(1.6);opacity:0.4} }
@keyframes otw-badge-glow { 0%,100%{box-shadow:0 0 0px rgba(57,255,136,0);border-color:rgba(57,255,136,0.35)} 50%{box-shadow:0 0 12px rgba(57,255,136,0.25),0 0 24px rgba(57,255,136,0.1);border-color:rgba(57,255,136,0.7)} }
@keyframes otw-badge-glow-light { 0%,100%{box-shadow:0 0 0px rgba(0,122,60,0);border-color:rgba(0,122,60,0.35)} 50%{box-shadow:0 0 10px rgba(0,122,60,0.2);border-color:rgba(0,122,60,0.65)} }

/* Scroll reveal */
.reveal { opacity:0;transform:translateY(28px);transition:opacity .55s ease,transform .55s cubic-bezier(.22,1,.36,1); }
.reveal.visible { opacity:1;transform:translateY(0); }
.reveal-delay-1{transition-delay:.08s} .reveal-delay-2{transition-delay:.16s} .reveal-delay-3{transition-delay:.24s} .reveal-delay-4{transition-delay:.32s}

/* Back to top */
#back-top { position:fixed !important;bottom:28px !important;left:16px !important;right:auto !important;transform:none !important;z-index:9990;width:42px;height:42px;border-radius:50%;background:var(--panel);border:1px solid var(--border);color:var(--cyan);font-size:18px;display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;pointer-events:none;transition:opacity .3s,box-shadow .2s;box-shadow:0 0 10px rgba(0,229,255,0.1); }
#back-top.visible{opacity:1;pointer-events:all;} #back-top:hover{transform:translateY(-3px);box-shadow:0 0 18px rgba(0,229,255,0.25);border-color:var(--cyan);}
@media(min-width:769px){#back-top{display:none;}}

/* Copy toast */
#copy-toast { position:fixed;bottom:28px;left:50%;transform:translateX(-50%) translateY(20px);z-index:9995;background:var(--panel);border:1px solid var(--teal-dim);border-radius:8px;padding:8px 18px;font-size:0.72rem;color:var(--teal);letter-spacing:0.06em;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;white-space:nowrap; }
#copy-toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

/* Page transitions */
.page{transition:opacity .22s ease;} .page.page-leaving{opacity:0;}
.page.active{animation:pageFadeIn .28s ease both;}
@keyframes pageFadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}

/* Bouton dl CV */
.btn-dl { background:rgba(255,170,0,0.08);color:var(--amber);border:1px solid rgba(255,170,0,0.35); }
.btn-dl:hover { background:rgba(255,170,0,0.18);box-shadow:0 0 16px rgba(255,170,0,0.2);transform:translateY(-2px); }
body.ocean-light .btn-dl { background:rgba(180,100,0,0.08);color:#b06000;border-color:rgba(180,100,0,0.35); }

/* Modal canvas */
#modal-canvas { position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;border-radius:10px;z-index:0;opacity:0.55; }
/* Sticky header au-dessus du canvas */
#modal-box > div[style*="sticky"] { z-index:10 !important; }
body.ocean-light #modal-canvas{opacity:0.35;}
#modal-box{position:fixed !important;overflow-y:auto !important;overflow-x:hidden !important;-webkit-overflow-scrolling:touch;}
#modal-box > *:not(#modal-canvas){position:relative;z-index:1;}

/* Algues mode lumineux */
body.ocean-light .algae path { stroke-opacity:1 !important;filter:drop-shadow(0 0 3px rgba(0,120,90,0.4)); }
body.ocean-light .algae:nth-child(1) path{stroke:#007a5a;stroke-width:3;}
body.ocean-light .algae:nth-child(2) path{stroke:#0077aa;stroke-width:2.5;}
body.ocean-light .algae:nth-child(3) path{stroke:#007a5a;stroke-width:3;}
body.ocean-light .algae:nth-child(4) path{stroke:#1a9a40;stroke-width:2.5;}

/* Bloupi mode lumineux */
body.ocean-light #bloupi-btn{background:linear-gradient(135deg,#b8e8f5 60%,#a0d8ec);border-color:#007a6a;box-shadow:0 0 18px rgba(0,122,106,0.3),0 0 40px rgba(0,119,170,0.1);}
body.ocean-light #bloupi-win{background:linear-gradient(160deg,#b4e2f2 0%,#9ed4ea 60%,#aadcea 100%);border-color:#7acde0;box-shadow:0 8px 48px rgba(0,80,120,0.2),0 0 0 1px rgba(0,119,170,0.1);}
body.ocean-light .bloupi-header{background:linear-gradient(90deg,#9fd5ea,#b4e2f2);border-bottom-color:#7acde0;}
body.ocean-light .bloupi-msg-user .bloupi-bubble{background:linear-gradient(135deg,#90cce4,#a8dcee);border-color:#7acde0;color:#002a3a;}
body.ocean-light .bloupi-msg-bot .bloupi-bubble{background:linear-gradient(135deg,#b4e2f2,#9ed4ea);border-color:rgba(0,122,106,0.3);color:#002a3a;}
body.ocean-light .bloupi-bubble strong{color:#0077aa;}
body.ocean-light .bloupi-bubble em{color:#007a6a;}
body.ocean-light #bloupi-input{background:rgba(150,210,235,0.7);border-color:#7acde0;color:#002a3a;caret-color:#0077aa;}
body.ocean-light .bloupi-sug{background:rgba(150,210,235,0.8);border-color:#7acde0;color:#1a5060;}
body.ocean-light .bloupi-sug:hover{background:rgba(0,122,106,0.1);border-color:#007a6a;color:#0077aa;}
body.ocean-light .bloupi-input-area{background:rgba(140,200,225,0.4);border-top-color:#7acde0;}
body.ocean-light .bloupi-suggestions{border-top-color:rgba(122,205,224,0.5);}
body.ocean-light .bloupi-modal-badge{background:rgba(0,122,106,0.12);border-color:rgba(0,122,106,0.4);color:#007a6a;}

/* Mode impression */
@media print {
  nav,#ocean-canvas,.algae,.statusbar,.padb,#bloupi-btn,#bloupi-win,#back-top,#copy-toast,#page-loader,#custom-cursor,#theme-toggle,.bubbles-wrap,.page:not(#cv),#home{display:none !important;}
  body{background:white !important;color:#111 !important;font-family:Georgia,serif;font-size:11pt;cursor:default !important;}
  #cv{display:block !important;padding-top:0 !important;animation:none !important;}
  .sw{max-width:100%;padding:1cm 1.5cm;}
  .cvb{background:white !important;border:1px solid #ccc !important;box-shadow:none !important;break-inside:avoid;padding:10pt 12pt;}
  .cvit{color:#111 !important;} .cvid{color:#333 !important;} .card{background:white !important;border:1px solid #ccc !important;}
  @page{margin:1.5cm;}
}