/* ProPredictor style.css (ref12-fixes)
   - Mobile-friendly: ZERO column at 50% width of others
   - H36-0 grid (0 αριστερά, 3x12)
   - Strong chips / labels
   - Split markers 24px with units label
*/

/* App wrapper */
.pp-app { background:#fff; color:#0b1222; font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, "Helvetica Neue", Arial, sans-serif; }
.pp-white-bg { background:#fff; }

/* Toolbar */
.pp-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:6px 10px 8px; margin-top:2px; }
.pp-toolbar-left, .pp-toolbar-right { display:flex; align-items:center; gap:10px; }
.pp-btn { background:#1e2a5a; color:#e9eefc; border:none; padding:8px 12px; border-radius:8px; cursor:pointer; }
.pp-btn:hover { opacity:.9; }
.pp-btn-ghost { background:transparent; color:#1e2a5a; border:1px solid #1e2a5a; padding:8px 12px; border-radius:8px; cursor:pointer; }
.pp-center { display:flex; justify-content:center; }

/* BET + R12 */
.pp-btn-bet { border:none; padding:8px 14px; border-radius:999px; cursor:pointer; font-weight:700; }
.pp-btn-bet[data-state="no"] { background:#c62828; color:#fff; }
.pp-btn-bet[data-state="go"] { background:#2e7d32; color:#fff; }

/* R12 pill (δίπλα στο GO BET) */
.pp-r12-pill { margin-left:10px; border:1px solid #888; border-radius:999px; padding:6px 10px; font-size:13px; cursor:pointer; user-select:none; }
.pp-r12-pill[data-state="off"] { background:#fbe9e7; color:#b71c1c; border-color:#b71c1c; }
.pp-r12-pill[data-state="on"]  { background:#e8f5e9; color:#1b5e20; border-color:#1b5e20; }

/* Strips / rows */
.pp-strip-row { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:6px 10px; }
.pp-strip-left { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.pp-strip-actions { margin-left:auto; display:flex; align-items:center; gap:8px; }
.pp-strip-label { font-weight:800; color:#1e2a5a; }

/* Inputs */
.pp-input { padding:6px 10px; border:1px solid #c5cbe9; border-radius:8px; min-width:260px; }
.pp-number { width:72px; padding:6px 8px; border:1px solid #c5cbe9; border-radius:8px; }

/* Felt / board */
.pp-board-felt { width:min(100%, 1100px); background:#0b6b3a; padding:10px; border-radius:12px; position:relative; }

/* GRID */
.pp-grid {
  display:grid;
  grid-template-rows: repeat(3, minmax(54px, 1fr));
  /* ZERO column is 50% of other columns */
  grid-template-columns: 0.5fr repeat(12, 1fr);
  gap:2px;
  background:#093d28;
  border-radius:10px;
  padding:2px;
}

/* Cells */
.pp-cell {
  background:#0a0f1a;
  display:flex; align-items:center; justify-content:center;
  position:relative;
  border-radius:6px;
  color:#e9eefc; font-weight:700;
  user-select:none; cursor:pointer;
}
.pp-color-red   { background:#a51221; }
.pp-color-black { background:#121521; }
.pp-color-green { background:#0f7a45; }
.pp-cell > div:last-child { font-size:16px; }

/* Counter top-right */
.pp-time {
  position:absolute; top:4px; right:6px;
  font-size:12px; font-weight:800;
  background:rgba(0,0,0,.55); color:#fff;
  padding:2px 6px; border-radius:10px; line-height:1;
}

/* Marker overlay */
.pp-marker-layer {
  position:absolute; left:0; top:0; right:0; bottom:0;
  pointer-events:none;
}

/* Split chip markers */
:root { --pp-marker-size:24px; } /* μικρότερο κατά ~10px */
.pp-chip-marker {
  position:absolute;
  width:var(--pp-marker-size); height:var(--pp-marker-size);
  margin-left:calc(var(--pp-marker-size) * -0.5);
  margin-top:calc(var(--pp-marker-size) * -0.5);
  background:radial-gradient(#ffd54f 35%, #fbc02d 36%, #f9a825 70%);
  border:2px solid #212121;
  border-radius:999px;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 2px 6px rgba(0,0,0,.4);
}
.pp-chip-marker-label {
  font-size:12px; font-weight:800; color:#111;
  text-shadow:0 1px 0 rgba(255,255,255,.4);
}

/* Chips lines (proposed / last / repeated) */
.pp-chipline { display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.pp-chip { display:inline-flex; align-items:center; justify-content:center; min-width:28px; height:28px; padding:0 8px; border-radius:999px; color:#fff; font-weight:800; }
.pp-chip.red   { background:#e53935; }
.pp-chip.black { background:#263238; }
.pp-chip.green { background:#2e7d32; }
.pp-chip .pp-chip-label { font-size:13px; }

/* Count badge (Last count) */
.pp-count-badge {
  display:inline-flex; align-items:center; justify-content:center;
  min-width:24px; height:24px; border-radius:999px;
  background:#1e2a5a; color:#e9eefc; font-weight:800; font-size:12px;
}

/* Hidden debug output */
.pp-output { display:none; }

/* Responsive tweaks */
@media (max-width: 640px){
  .pp-chip { min-width:24px; height:24px; }
  .pp-chip .pp-chip-label { font-size:12px; }
  .pp-time { font-size:11px; }
}


/* === ProPredictor – patch (REF-04-09-25 • DEFINITIVE) === */
/* Hide any explicit "Proposed numbers" label */
[data-pp="proposed-title"], .proposed-title, #proposed-title { display:none !important; }

/* Proposed container shape */
#pp-proposed, [data-pp="proposed"], .proposed-numbers {
  display:flex; align-items:center; gap:6px; flex-wrap:wrap;
  padding:6px 8px; background:#f6f8ff; border:1px dashed #cbd3ff; border-radius:10px;
}

/* Chip shape */
.pp-chip { display:inline-flex; align-items:center; justify-content:center; min-width:28px; height:28px; padding:0 10px; border-radius:999px; color:#fff; font-weight:900; box-shadow:0 1px 3px rgba(0,0,0,.25); }
.pp-chip .pp-chip-label { font-size:13px; line-height:1; }

/* Singles (colors) */
.pp-chip.red { background:#e53935; }
.pp-chip.black { background:#263238; }
.pp-chip.green { background:#2e7d32; }

/* Splits (neutral yellow) – support both .split and .pp-chip-split */
.pp-chip.split, .pp-chip.pp-chip-split { background:#fbc02d; color:#1b1b1b; border:1px solid #b98200; }

/* R12 pill same colors as NO BET / GO BET */
#pp-r12-toggle, [data-pp="toggle-r12"] { display:inline-flex; align-items:center; justify-content:center; min-height:32px; padding:6px 14px; border-radius:999px; font-weight:800; cursor:pointer; border:0; color:#fff; user-select:none; }
#pp-r12-toggle[data-state="off"], [data-pp="toggle-r12"][data-state="off"] { background:#c62828; } /* red */
#pp-r12-toggle[data-state="on"],  [data-pp="toggle-r12"][data-state="on"]  { background:#2e7d32; } /* green */

/* Table markers for R12 singles */
:root { --pp-r12-marker:22px; }
.pp-r12-marker {
  position:absolute; width:var(--pp-r12-marker); height:var(--pp-r12-marker);
  margin-left:calc(var(--pp-r12-marker)*-0.5); margin-top:calc(var(--pp-r12-marker)*-0.5);
  background:#2e7d32; color:#fff; border:2px solid #0f3f1a; border-radius:999px;
  display:flex; align-items:center; justify-content:center; font-weight:900; font-size:12px;
  box-shadow:0 2px 5px rgba(0,0,0,.35);
}
/* === EOF patch === */

/* ===== EOF: style.css (REF-04-09-25 • DEFINITIVE FULL) ===== */


/* === Patch 05/09/25: R12 dimensions, Proposed label hide, Stop badges, Times Appear === */

/* R12 button same sizing as GO BET (.pp-btn-bet) */
#pp-r12-toggle{
  padding:8px 14px;
  border-radius:999px;
  font-weight:700;
  min-height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

/* Hide any explicit “Proposed numbers” title */
[data-pp="proposed-title"], .proposed-title, #proposed-title { display:none !important; }

/* Small STOP badge for blocked numbers on the grid */
.pp-stop-badge{
  position:absolute;
  top:4px; left:6px;
  display:inline-flex; align-items:center; justify-content:center;
  width:18px; height:18px; border-radius:50%;
  background:#c62828; color:#fff; font-size:11px; font-weight:900;
  box-shadow:0 1px 2px rgba(0,0,0,.35);
  pointer-events:none;
}
/* Chip for Times Appear uses existing pp-chip colors (no extra CSS needed) */


/* ==== ProPredictor FRONT PATCH v12 (append-only) ==== */
#pp-r12-toggle, #pp-r12, .pp-r12-pill, [data-pp="toggle-r12"]{
  display:inline-flex; align-items:center; justify-content:center;
  padding:8px 14px; border-radius:999px; font-weight:700; color:#fff;
}
#pp-r12-toggle[data-state="off"], .pp-r12-pill[data-state="off"], [data-pp="toggle-r12"][data-state="off"]{ background:#c62828; }
#pp-r12-toggle[data-state="on"],  .pp-r12-pill[data-state="on"],  [data-pp="toggle-r12"][data-state="on"] { background:#2e7d32; }
#proposed-title, .proposed-title, [data-pp="proposed-title"],
.pp-strip-label.pp-hide-proposed{ display:none !important; }
.pp-chip{display:inline-flex;align-items:center;justify-content:center;min-width:28px;height:28px;padding:0 10px;border-radius:999px;color:#fff;font-weight:900;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.pp-chip .pp-chip-label{font-size:13px;line-height:1}
.pp-chip.red{background:#e53935}.pp-chip.black{background:#263238}.pp-chip.green{background:#2e7d32}
#pp-r12-overlay{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:3}
.pp-r12-marker{position:absolute;width:22px;height:22px;margin-left:-11px;margin-top:-11px;
  background:#FFC107;color:#000;border:2px solid #A67C00;border-radius:999px;
  display:flex;align-items:center;justify-content:center;font-weight:900;font-size:11px;
  text-shadow:0 1px 0 rgba(255,255,255,.35);box-shadow:0 1px 3px rgba(0,0,0,.25)}
/* ==== EOF FRONT PATCH v12 ==== */
/* ==== ProPredictor FRONT PATCH v28 (append-only) ==== */
/* Το R γίνεται κλώνος του NO BET. Μόνο ένα μικρό margin & visibility control. */
#pp-r-onoff-inline{
  margin-right:6px;
  visibility:hidden; /* θα γίνει visible όταν ολοκληρωθεί το ντύσιμο -> no flicker */
}
/* ΜΟΝΟ το φόντο αλλάζει ανά state. Όλα τα άλλα έρχονται από τις κλάσεις του NO BET. */
#pp-r-onoff-inline[data-state="on"]  { background:#2e7d32 !important; }
#pp-r-onoff-inline[data-state="off"] { background:#c62828 !important; }
/* Μην αφήσεις min-width να το “φουσκώσει” από theme */
#pp-r-onoff-inline{ min-width:auto !important; width:auto !important; }
/* ==== EOF v28 ==== */
/* ==== ProPredictor FRONT PATCH v29 (safety) ==== */
/* Force-hide any legacy R12 UI that might leak from template */
#pp-r12-toggle,
.pp-r12-pill,
span#pp-r12-toggle,
.pp-strip-left #pp-r12-toggle { display:none !important; visibility:hidden !important; }

/* Keep inline R button uncluttered; rely on cloned classes from NO BET */
#pp-r-onoff-inline{ min-width:auto !important; width:auto !important; }
/* ==== EOF v29 ==== */
/* ==== ProPredictor FRONT PATCH v31 (text styling) ==== */
#pp-r-onoff-inline {
  color: #fff !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: .5px;
}
/* ==== EOF v31 ==== */

/* ==== ProPredictor FRONT PATCH v32 (board chip image) ==== */
/* Chip rendered inside cell using background-image; falls back to styled dot if image missing */
:root{
  /* Optional: override this to point to your PNG/SVG:  --pp-chip-r12-img: url('/media/com_propredictor/img/chips/yellow-1.png'); */
  --pp-chip-r12-img: ;
}
#pp-board-h360 .pp-cell{ position:relative; } /* safety */
.pp-r12-dot{ display:none !important; } /* hide previous dot style */
.pp-r12-chip{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:28px; height:28px; border-radius:50%;
  background-repeat:no-repeat; background-position:center; background-size:cover;
  display:flex; align-items:center; justify-content:center;
  font-weight:900; font-size:12px; color:#000;
  text-shadow: 0 1px 0 rgba(255,255,255,.6);
  box-shadow: 0 2px 4px rgba(0,0,0,.35);
  pointer-events:none; z-index:3;
}
/* Fallback look when no image is set */
.pp-r12-chip.noimg{
  background: radial-gradient(ellipse at center, #ffd54f 0%, #ffc107 60%, #ffb300 100%);
  border:2px solid #a67c00;
  color:#000;
}
/* Smaller on very small phones */
@media (max-width: 420px){
  .pp-r12-chip{ width:24px; height:24px; font-size:11px; }
}
/* ==== EOF v32 ==== */

/* ==== REF-09-09-25-V002 UI LAYOUT PATCH (append-only) ==== */

/* 1) Hide the legacy top toolbar row entirely */
.pp-toolbar, .pp-toolbar-left, .pp-toolbar-right { display:none !important; visibility:hidden !important; height:0 !important; padding:0 !important; margin:0 !important; }

/* 2) New bottom bars (Actions & Systems) */
.pp-bottom-stack { display:flex; flex-direction:column; gap:6px; padding:6px 10px; }

.pp-actions-row { display:flex; align-items:center; justify-content:flex-end; gap:8px; }
.pp-actions-row .pp-btn-ghost { padding:8px 12px; border-radius:10px; }

.pp-systemsbar { position:relative; display:flex; align-items:center; justify-content:center; gap:8px;
  padding:6px 10px; border-top:1px solid rgba(0,0,0,.08); }
.pp-systemsbar .pp-menu-btn{
  background:#1e2a5a; color:#e9eefc; border:none; padding:8px 14px; border-radius:10px;
  font-weight:700; cursor:pointer; user-select:none;
}
.pp-systemsbar .pp-menu-btn:hover{ opacity:.92; }

/* Submenu panel that opens UP (overlapping the dashboard) */
.pp-submenu{
  position:absolute; bottom:42px; /* open upwards above the bar */
  left:50%; transform:translateX(-50%);
  display:none; min-width:280px;
  background:#fff; border:1px solid rgba(0,0,0,.1); border-radius:12px;
  box-shadow:0 14px 30px rgba(0,0,0,.18);
  padding:8px; z-index:9999;
}
.pp-submenu.active{ display:block; }
.pp-submenu .pp-subitem{ padding:8px 10px; border-radius:8px; cursor:pointer; font-size:13px; }
.pp-submenu .pp-subitem:hover{ background:#f5f7fb; }

/* 3) Hide “Repeated Last 24” row and content */
#pp-rep-24 { display:none !important; }
#pp-rep-24::before { display:none !important; }
.pp-strip-row:has(#pp-rep-24){ display:none !important; } /* modern browsers; JS fallback exists */

/* 4) Minor: ensure grid container keeps spacing with hidden rows */
.pp-strip-row { padding:6px 10px; }

/* ==== EOF V002 ==== */