/* Fullscreen board */
.pl-board-page{margin-top:10px;padding:10px;}
.pl-board-top{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:10px;}
.pl-board-title{font-size:20px;font-weight:700;margin-right:auto;}
.pl-board-filters{display:flex;flex-wrap:wrap;gap:10px;align-items:center;}
.pl-board-check{display:flex;align-items:center;gap:6px;font-weight:600;}
.pl-board-meta{margin-left:auto;display:flex;align-items:center;gap:8px;opacity:.8;}
.pl-dot{opacity:.5}

.pl-board-grid{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(280px,1fr);gap:12px;overflow-x:auto;padding-bottom:8px;}
@media (min-width: 1200px){ .pl-board-grid{grid-auto-columns:minmax(320px,1fr);} }
@media (min-width: 1600px){ .pl-board-grid{grid-auto-columns:minmax(360px,1fr);} }

.pl-col{background:rgba(0,0,0,0.02);border-radius:12px;padding:10px;min-height:200px;}
.pl-col-head{display:flex;justify-content:space-between;align-items:baseline;font-weight:800;font-size:16px;margin-bottom:10px;}
.pl-col-count{font-weight:700;opacity:.7;font-size:13px;}

.pl-card{background:#fff;border-radius:12px;padding:10px;box-shadow:0 1px 2px rgba(0,0,0,.08);margin-bottom:10px;}
.pl-card-top{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;}
.pl-card-mo{font-size:15px;font-weight:800;}
.pl-card-prod{margin-top:6px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.pl-card-job{margin-top:6px;opacity:.85;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.pl-card-nums{display:flex;gap:12px;margin-top:8px;}
.pl-card-nums .pl-k{display:block;font-size:11px;opacity:.7}
.pl-card-nums .pl-v{display:block;font-size:16px;font-weight:800}

.pl-progress{height:8px;background:rgba(0,0,0,.08);border-radius:999px;overflow:hidden;margin-top:8px;}
.pl-progress-bar{height:100%;background:rgba(25,168,122,.9);}
.pl-card-times{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px;font-size:12px;opacity:.85}
.pl-dur{margin-left:auto;font-weight:800;}
.pl-card-dur{margin-left:auto;font-weight:800;}

.pl-status{display:inline-block !important;padding:2px 8px !important;border-radius:6px !important;font-weight:600 !important;font-size:0.85em !important;white-space:nowrap !important;}
.pl-status-draft{background:#e5e7eb !important;color:#374151 !important;}
.pl-status-validated{background:#b6921a !important;color:#fff !important;}
.pl-status-inprogress{background:#19a87a !important;color:#fff !important;}
.pl-status-produced{background:#cfd4d7 !important;color:#374151 !important;}
.pl-status-cancelled{background:#f3f4f6 !important;color:#6b7280 !important;}
.pl-status-unknown{background:#9ca3af !important;color:#111827 !important;}

/* Fullscreen tweaks */
body.pl-fullscreen .pl-board-top{position:sticky;top:0;background:rgba(255,255,255,.9);backdrop-filter:blur(6px);padding:8px;border-radius:12px;z-index:10;}
/* Hide Dolibarr chrome in kiosk/fullscreen */
.pl-kiosk #id-left,
.pl-kiosk #id-top,
.pl-kiosk .side-nav,
.pl-kiosk .tmenudiv,
.pl-kiosk #mainmenu,
.pl-kiosk #topmenu,
.pl-kiosk #menu,
.pl-kiosk #id-left-menu,
.pl-fullscreen #id-left,
.pl-fullscreen #id-top,
.pl-fullscreen .side-nav,
.pl-fullscreen .tmenudiv,
.pl-fullscreen #mainmenu,
.pl-fullscreen #topmenu,
.pl-fullscreen #menu,
.pl-fullscreen #id-left-menu{
  display:none !important;
}
.pl-kiosk #id-right,
.pl-fullscreen #id-right{
  margin-left:0 !important;
  left:0 !important;
  width:100% !important;
}
.pl-kiosk #id-container,
.pl-fullscreen #id-container{
  padding-top:0 !important;
  margin-top:0 !important;
}


/* Prevent layout shift when numbers change */
.pl-board-meta, .pl-board-meta * { font-variant-numeric: tabular-nums; }
#plClock { display:inline-block; min-width: 200px; }
#plRefreshCountdown { display:inline-block; min-width: 2ch; text-align:right; }


/* Auto-hide top bar */
.pl-board-top.pl-top-hidden{transform:translateY(-100%);opacity:0;pointer-events:none;}
.pl-board-top{transition:transform .3s ease, opacity .3s ease;}

#plTopHotzone{position:fixed;top:0;left:0;right:0;height:14px;z-index:10050;}
body:not(.pl-top-hidden) #plTopHotzone{display:none;}

body.pl-top-hidden .pl-board-top{transform:translateY(-110%);opacity:0;pointer-events:none;}
.pl-board-top{transition:transform .25s ease, opacity .25s ease;}

/* =======================================================================
   Theme integration
   - Default should follow Dolibarr light theme
   - Fullscreen should always be dark (kiosk board)
   ======================================================================= */

/* Default (non-fullscreen): keep Dolibarr look (light) */
.pl-board-page { background: transparent; color: var(--colortext, #333); }
.pl-board-top { background: transparent; color: var(--colortext, #333); }
.pl-board-top * { color: inherit; }

/* Card/columns should use Dolibarr body background */
.pl-col { background: var(--colorbackbody, #ffffff); }
.pl-col-head, .pl-col-head * { color: var(--colortext, #333); }
.pl-card { background: var(--colorbackbody, #ffffff); color: var(--colortext, #333); }
.pl-card * { color: inherit; }
.pl-card a { color: var(--colorlink, #1a5fb4); }
.pl-progress-track { background: #e6e6e6; }

/* Fullscreen: force dark regardless of Dolibarr theme */
body.pl-fullscreen .pl-board-page { background: #0b0b0b !important; color: #eaeaea !important; }
body.pl-fullscreen .pl-board-top { background: rgba(0,0,0,0.70) !important; color: #eaeaea !important; }
body.pl-fullscreen .pl-board-top * { color: inherit !important; }
body.pl-fullscreen .pl-col { background: #121212 !important; }
body.pl-fullscreen .pl-col-head, body.pl-fullscreen .pl-col-head * { color: #eaeaea !important; }
body.pl-fullscreen .pl-card { background: #1a1a1a !important; color: #eaeaea !important; }
body.pl-fullscreen .pl-card a { color: #9ecbff !important; }
body.pl-fullscreen .pl-progress-track { background: #2a2a2a !important; }

/* Ensure tooltips visible above everything */
.ui-tooltip { z-index: 10060; }

/* ==========================================================
   Theme switch (Light default, Dark only in fullscreen)
   Controlled by body.pl-board-light / body.pl-board-dark
   ========================================================== */
body.pl-board-light .pl-board-page { background: transparent; color:#222; }
body.pl-board-light .pl-board-top { background: transparent; color:#222; }
body.pl-board-light .pl-board-top * { color: inherit; }
body.pl-board-light .pl-col { background:#ffffff; }
body.pl-board-light .pl-col-head, body.pl-board-light .pl-col-head * { color:#222; }
body.pl-board-light .pl-card { background:#ffffff; color:#222; }
body.pl-board-light .pl-card a { color:#1a5fb4; }
body.pl-board-light .pl-progress-track { background:#e6e6e6; }

/* Workstation titles must be readable in light */
body.pl-board-light .pl-col-title,
body.pl-board-light .pl-station-title,
body.pl-board-light .pl-col-head h3 { color:#222; }

/* Dark (fullscreen) */
body.pl-board-dark .pl-board-page { background:#0b0b0b; color:#eaeaea; }
body.pl-board-dark .pl-board-top { background: rgba(0,0,0,0.70); color:#eaeaea; }
body.pl-board-dark .pl-board-top * { color: inherit; }
body.pl-board-dark .pl-col { background:#121212; }
body.pl-board-dark .pl-col-head, body.pl-board-dark .pl-col-head * { color:#eaeaea; }
body.pl-board-dark .pl-card { background:#1a1a1a; color:#eaeaea; }
body.pl-board-dark .pl-card a { color:#9ecbff; }
body.pl-board-dark .pl-progress-track { background:#2a2a2a; }

/* Tooltip z-index */
.ui-tooltip { z-index: 10060; }

/* TipTip (Dolibarr) tooltip look: white card + rounded corners */
.tiptip_holder{ z-index: 10080 !important; }
.tiptip_holder .tiptip_content{
  background:#fff !important;
  color:#222 !important;
  border:1px solid rgba(0,0,0,.18) !important;
  border-radius:10px !important;
  padding:10px 12px !important;
  box-shadow:0 8px 24px rgba(0,0,0,.18) !important;
  max-width: 640px !important;
}

/* Hide arrow to match Dolibarr card-like tooltip */
.tiptip_holder .tiptip_arrow, .tiptip_holder .tiptip_arrow_inner{ display:none !important; }

/* HTML tooltip fallback container (created in planning/js/board.js)
   Make it match Dolibarr standard white tooltip look.
   Inline styles are overridden via !important.
*/
#plHtmlTooltip{
  background:#fff !important;
  color:#222 !important;
  border:1px solid rgba(0,0,0,.18) !important;
  border-radius:10px !important;
  box-shadow:0 8px 24px rgba(0,0,0,.18) !important;
  padding:10px 12px !important;
  font-size:13px !important;
  line-height:1.45 !important;
  max-width:640px !important;
}

#plHtmlTooltip .fa,
#plHtmlTooltip .fas,
#plHtmlTooltip .far{
  color:#a69944 !important;
}

#plHtmlTooltip .badge-status{
  background:#19a87a !important;
  color:#fff !important;
  padding:2px 8px !important;
  border-radius:6px !important;
  font-weight:600 !important;
  font-size:0.85em !important;
  white-space:nowrap !important;
}

#plHtmlTooltip a{
  color:var(--colorlink, #1a5fb4) !important;
  text-decoration:none !important;
}
#plHtmlTooltip a:hover{ text-decoration:underline !important; }




/* =========================
   Top bar controls colors
   - Light: follow Dolibarr
   - Dark: only in fullscreen (pl-board-dark)
   ========================= */
body.pl-board-light .pl-board-top select,
body.pl-board-light .pl-board-top input,
body.pl-board-light #plStation,
body.pl-board-light #plRefresh,
body.pl-board-light select[name="station"],
body.pl-board-light select[name="refresh"]{
  color: var(--colortext, #333) !important;
  background: var(--colorbackbody, #fff) !important;
  border-color: rgba(0,0,0,0.15) !important;
}

body.pl-board-dark .pl-board-top select,
body.pl-board-dark .pl-board-top input,
body.pl-board-dark #plStation,
body.pl-board-dark #plRefresh,
body.pl-board-dark select[name="station"],
body.pl-board-dark select[name="refresh"]{
  color: #eaeaea !important;
  background: #1f1f1f !important;
  border-color: rgba(255,255,255,0.18) !important;
}

/* Dropdown options (browser-native list) */
body.pl-board-dark #plStation option,
body.pl-board-dark #plRefresh option,
body.pl-board-dark select[name="station"] option,
body.pl-board-dark select[name="refresh"] option{
  background: #fff !important;
  color: #111 !important;
}