/* ============================================================================
   graphite.css — Φόντο «Γραφίτης» (24.10.2026).

   Ιδιοκτήτης: «create in the app a new background, the one we have on our site … gold buttons instead
   of red ones everywhere, red should be only for delete, remove and cancel … when in that background
   mode and switching to day mode i want the buttons gold there as well … dont change the red buttons
   from the classic style, keep it exactly like it is».

   Άρα:
     · ΜΟΝΟ ΠΡΟΣΘΗΚΕΣ. Κάθε κανόνας εδώ θέλει data-bg="graphite" στο <html> (core/silk-bg.js, και το
       <head> του index.html πριν ζωγραφίσει η σελίδα). Χωρίς αυτό το αρχείο δεν κάνει τίποτα: το
       κλασικό και το Μετάξι μένουν ΑΚΡΙΒΩΣ όπως ήταν.
     · ΝΥΧΤΑ = το μαύρο-γραφίτης του site (#0D0D10…), ΜΕΡΑ = ζεστό υπόλευκο (#F5EFE5), και στα δύο
       τα κύρια κουμπιά (--action) ΧΡΥΣΑ με σκούρα γράμματα.
     · Το κόκκινο της διαγραφής ΔΕΝ περνά από εδώ: τα κουμπιά διαγραφής/αφαίρεσης έχουν δικό τους
       --crit (.btn-danger, .tmenu-item.danger), που μένει κόκκινο.
     · @media screen όπως τα νυχτερινά tokens: το χαρτί τυπώνεται πάντα με το κλασικό της μέρας.
     · Η νύχτα γράφεται ΔΥΟ φορές (ρητή «Νύχτα» και «Αυτόματο» σε σκούρο λειτουργικό), για τον λόγο
       που εξηγεί το tokens.css (03.09.2026): αλλιώς η μία από τις δύο περιπτώσεις μένει με τα
       χρώματα της μέρας.

   Αντιθέσεις (μετρημένες): μέρα κείμενο 15,2:1 · δεύτερο 9,9 · σβησμένο 6,2 · αχνό 4,8 · γράμματα
   στο χρυσό κουμπί 8,5. Νύχτα κείμενο 15,2 · σβησμένο 7,1 · αχνό 4,9 · γράμματα στο χρυσό 10,6.
   ========================================================================== */

/* ── ΜΕΡΑ ──────────────────────────────────────────────────────────────────── */
@media screen {
  :root[data-bg="graphite"] {
    /* Τα κύρια κουμπιά: το χρυσό της μέρας με σκούρα γράμματα (8,5:1). */
    --action: #d0ab64; --action-d: #be9852; --action-ink: #1a1406;
    --action-ring: rgba(208,171,100,.38); --action-glow: rgba(176,137,76,.55);

    /* Το ναυτικό της εφαρμογής γίνεται γραφίτης. */
    --navy: #1e1e23; --navy-l: #26262c;
    --primary: #1e1e23; --primary-d: #2e2e35;

    --ink: #1a1a1e; --ink-2: #3e3a35; --muted: #5e584f; --faint: #6e685f;
    --line: rgba(30,26,20,.13); --line-2: rgba(30,26,20,.07);
    --bg1: #fbf8f3; --bg2: #f5efe5;
    --card-2: rgba(240,232,218,.55);
    --card2-solid: #f5efe5;
    --plate-2: rgba(245,239,229,.60);
    --plate2-solid: #f8f4ee;
    --overlay: rgba(13,13,16,.44);

    --shadow:    0 1px 0 var(--hair) inset, 0 1px 3px rgba(28,24,18,.06), 0 14px 34px -14px rgba(28,24,18,.16);
    --shadow-sm: 0 1px 0 var(--hair) inset, 0 1px 2px rgba(28,24,18,.06), 0 6px 20px -8px rgba(28,24,18,.12);
    --shadow-lg: 0 2px 6px rgba(28,24,18,.05), 0 30px 64px -28px rgba(28,24,18,.3);
    --shadow-up: 0 -1px 0 var(--line-2), 0 -8px 24px -18px rgba(28,24,18,.3);
    --sel-lift:  0 1px 1px rgba(28,24,18,.06), 0 2px 6px -3px rgba(28,24,18,.16);
    --pimg-edge: inset 0 0 0 1px rgba(28,24,18,.10);
    --field-inset: inset 0 1px 2px rgba(28,24,18,.07);
    --chev: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%235e584f' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    --scroll-thumb: rgba(28,24,18,.30);
  }

  /* Το φόντο της μέρας: ζεστό υπόλευκο, με τις ίδιες «καρτο-κλίμακας» λάμψεις που χρειάζεται το γυαλί
     (βλ. base.css, body) — χρυσές αντί για ναυτικές. */
  :root[data-bg="graphite"] body {
    background:
      radial-gradient(900px 520px at 14% -10%, rgba(225,193,119,.16), transparent 60%),
      radial-gradient(700px 700px at 50% 118%, rgba(208,171,100,.07), transparent 60%),
      radial-gradient(880px 600px at 92% 50%, rgba(30,26,20,.05), transparent 62%),
      radial-gradient(880px 600px at 4% 84%, rgba(201,168,76,.14), transparent 62%),
      linear-gradient(170deg, #fbf8f3, #f5efe5 60%, #f1eadf);
    background-attachment: fixed;
    background-color: #f1eadf;
  }

  /* Τη μέρα το χρυσό κουμπί ξεχωρίζει λίγο από το υπόλευκο (1,9:1): μια λεπτή σκουρόχρυση ακμή (3,4:1)
     το κάνει να διαβάζεται κουμπί. Τη νύχτα δεν χρειάζεται (11:1). */
  :root[data-bg="graphite"]:not([data-theme="dark"]) .btn-primary { border-color: #a8843f; }
}
@media screen and (prefers-color-scheme: dark) {
  :root[data-bg="graphite"]:not([data-theme="light"]) .btn-primary { border-color: var(--action); }
}

/* ── ΝΥΧΤΑ (ρητή «Νύχτα») ──────────────────────────────────────────────────── */
@media screen {
  :root[data-bg="graphite"][data-theme="dark"] {
    --action: #e1c177; --action-d: #f2d692; --action-ink: #1a1406;
    --action-ring: rgba(225,193,119,.42); --action-glow: rgba(225,193,119,.55);
    --navy: #2a2a31; --navy-l: #222228;
    --primary: #2a2a31; --primary-d: #34343c;

    --ink: #f5efe5; --ink-2: #dcd5ca; --muted: #aba59c; --faint: #8c877f;
    --line: rgba(255,255,255,.15); --line-2: rgba(255,255,255,.09);
    --bg1: #121216; --bg2: #0f0f12;
    --card: rgba(28,28,33,.62); --card-2: rgba(34,34,40,.62); --field: rgba(36,36,42,.68);
    --card-solid: #1a1a1f; --card2-solid: #212126; --field-solid: #24242a;
    --glass: rgba(34,34,40,.55);
    --glass-2: rgba(34,34,40,.72);
    --glass-strong: rgba(26,26,31,.92);
    --card-glass: rgba(38,38,45,.62);
    --plate: rgba(28,28,33,.66);
    --plate-2: rgba(34,34,40,.62);
    --plate-solid: #1a1a1f;
    --plate2-solid: #212126;
    --nodriver-ink: #0d0d10;

    --shadow-sm: 0 1px 0 rgba(255,255,255,.06) inset, 0 0 0 1px rgba(0,0,0,.45), 0 1px 1px rgba(0,0,0,.3), 0 8px 18px -8px rgba(0,0,0,.6);
    --shadow:    0 1px 0 rgba(255,255,255,.06) inset, 0 0 0 1px rgba(0,0,0,.45), 0 2px 4px rgba(0,0,0,.25), 0 18px 40px -14px rgba(0,0,0,.65);
    --shadow-lg: 0 0 0 1px rgba(0,0,0,.5), 0 2px 6px rgba(0,0,0,.4), 0 30px 64px -24px rgba(0,0,0,.8);
    --shadow-up: 0 -1px 0 var(--line-2), 0 -8px 24px -18px rgba(0,0,0,.75);
    --bezel-gap: #1a1a1f;
    --chev: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23aba59c' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    --bar-glass: rgba(34,34,40,.56);
    /* Όσα ορίζει η ΜΕΡΑ του Γραφίτη ξαναγράφονται εδώ: στο «Αυτόματο» με σκούρο λειτουργικό ταιριάζει και ο
       κανόνας της μέρας (ίδια εξειδίκευση, πιο κάτω στη σειρά από το tokens.css), οπότε χωρίς αυτά η νύχτα θα
       έπαιρνε σκιά πεδίου, μπάρα κύλισης και φόντο παραθύρου της μέρας. */
    --overlay: rgba(0,0,0,.62);
    --sel-lift:  inset 0 1px 0 rgba(255,255,255,.06), 0 2px 6px -3px rgba(0,0,0,.6);
    --pimg-edge: inset 0 0 0 1px rgba(255,255,255,.12);
    --field-inset: inset 0 1px 2px rgba(0,0,0,.38);
    --scroll-thumb: rgba(255,255,255,.28);
  }
  /* Το φόντο της νύχτας: όπως το site, μαύρο-γραφίτης με μια χρυσή και μια γκρι λάμψη. */
  :root[data-bg="graphite"][data-theme="dark"] body {
    background:
      radial-gradient(900px 520px at 84% -8%, rgba(225,193,119,.12), transparent 60%),
      radial-gradient(820px 620px at 6% 6%, rgba(120,120,135,.14), transparent 58%),
      radial-gradient(780px 520px at 92% 52%, rgba(120,120,135,.16), transparent 62%),
      radial-gradient(780px 520px at 4% 86%, rgba(225,193,119,.10), transparent 62%),
      linear-gradient(180deg, #121216, #0b0b0e 62%, #0f0f12);
    background-attachment: fixed;
    background-color: #0f0f12;
  }
}

/* ── ΝΥΧΤΑ («Αυτόματο» σε σκούρο λειτουργικό) — ΙΔΙΕΣ τιμές με το από πάνω ──── */
@media screen and (prefers-color-scheme: dark) {
  :root[data-bg="graphite"]:not([data-theme="light"]) {
    --action: #e1c177; --action-d: #f2d692; --action-ink: #1a1406;
    --action-ring: rgba(225,193,119,.42); --action-glow: rgba(225,193,119,.55);
    --navy: #2a2a31; --navy-l: #222228;
    --primary: #2a2a31; --primary-d: #34343c;

    --ink: #f5efe5; --ink-2: #dcd5ca; --muted: #aba59c; --faint: #8c877f;
    --line: rgba(255,255,255,.15); --line-2: rgba(255,255,255,.09);
    --bg1: #121216; --bg2: #0f0f12;
    --card: rgba(28,28,33,.62); --card-2: rgba(34,34,40,.62); --field: rgba(36,36,42,.68);
    --card-solid: #1a1a1f; --card2-solid: #212126; --field-solid: #24242a;
    --glass: rgba(34,34,40,.55);
    --glass-2: rgba(34,34,40,.72);
    --glass-strong: rgba(26,26,31,.92);
    --card-glass: rgba(38,38,45,.62);
    --plate: rgba(28,28,33,.66);
    --plate-2: rgba(34,34,40,.62);
    --plate-solid: #1a1a1f;
    --plate2-solid: #212126;
    --nodriver-ink: #0d0d10;

    --shadow-sm: 0 1px 0 rgba(255,255,255,.06) inset, 0 0 0 1px rgba(0,0,0,.45), 0 1px 1px rgba(0,0,0,.3), 0 8px 18px -8px rgba(0,0,0,.6);
    --shadow:    0 1px 0 rgba(255,255,255,.06) inset, 0 0 0 1px rgba(0,0,0,.45), 0 2px 4px rgba(0,0,0,.25), 0 18px 40px -14px rgba(0,0,0,.65);
    --shadow-lg: 0 0 0 1px rgba(0,0,0,.5), 0 2px 6px rgba(0,0,0,.4), 0 30px 64px -24px rgba(0,0,0,.8);
    --shadow-up: 0 -1px 0 var(--line-2), 0 -8px 24px -18px rgba(0,0,0,.75);
    --bezel-gap: #1a1a1f;
    --chev: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23aba59c' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    --bar-glass: rgba(34,34,40,.56);
    /* Όσα ορίζει η ΜΕΡΑ του Γραφίτη ξαναγράφονται εδώ: στο «Αυτόματο» με σκούρο λειτουργικό ταιριάζει και ο
       κανόνας της μέρας (ίδια εξειδίκευση, πιο κάτω στη σειρά από το tokens.css), οπότε χωρίς αυτά η νύχτα θα
       έπαιρνε σκιά πεδίου, μπάρα κύλισης και φόντο παραθύρου της μέρας. */
    --overlay: rgba(0,0,0,.62);
    --sel-lift:  inset 0 1px 0 rgba(255,255,255,.06), 0 2px 6px -3px rgba(0,0,0,.6);
    --pimg-edge: inset 0 0 0 1px rgba(255,255,255,.12);
    --field-inset: inset 0 1px 2px rgba(0,0,0,.38);
    --scroll-thumb: rgba(255,255,255,.28);
  }
  :root[data-bg="graphite"]:not([data-theme="light"]) body {
    background:
      radial-gradient(900px 520px at 84% -8%, rgba(225,193,119,.12), transparent 60%),
      radial-gradient(820px 620px at 6% 6%, rgba(120,120,135,.14), transparent 58%),
      radial-gradient(780px 520px at 92% 52%, rgba(120,120,135,.16), transparent 62%),
      radial-gradient(780px 520px at 4% 86%, rgba(225,193,119,.10), transparent 62%),
      linear-gradient(180deg, #121216, #0b0b0e 62%, #0f0f12);
    background-attachment: fixed;
    background-color: #0f0f12;
  }
}

/* ── ΚΙΝΗΤΟ: το πιο διάφανο γυαλί (tokens.css, 05.10.2026), σε γραφίτη ──────── */
@media screen and (max-width: 719px) {
  :root[data-bg="graphite"][data-theme="dark"] {
    --glass-2:    rgba(34,34,40,.56);
    --card-glass: linear-gradient(180deg, rgba(48,48,56,.52), rgba(34,34,40,.34));
  }
}
@media screen and (max-width: 719px) and (prefers-color-scheme: dark) {
  :root[data-bg="graphite"]:not([data-theme="light"]) {
    --glass-2:    rgba(34,34,40,.56);
    --card-glass: linear-gradient(180deg, rgba(48,48,56,.52), rgba(34,34,40,.34));
  }
}

/* ══ ΧΡΩΜΑΤΑ ΓΡΑΜΜΕΝΑ ΚΑΤΕΥΘΕΙΑΝ ΣΤΑ ΑΛΛΑ ΑΡΧΕΙΑ (24.10.2026, «why is the menu still blue?») ══════════
   Ό,τι δεν περνά από token έμενε ναυτικό στον Γραφίτη. Εδώ μόνο τα ΟΡΑΤΑ: το πλαϊνό μενού (base.css),
   η σκιά της πάνω μπάρας, το μήνυμα (toast), η κεφαλίδα του καιρού (destinations.css) και τα ναυτικά
   γράμματα πάνω σε χρυσό. Οι πολύ απαλές ναυτικές σκιές των καρτών δεν φαίνονται και μένουν. */
@media screen {
  /* Μέρα: το κρεμ μενού μένει, χάνει μόνο τη ναυτική ακμή. */
  :root[data-bg="graphite"] .sidebar { border-right-color: rgba(30,26,20,.08); }
  :root[data-bg="graphite"] .topbar { border-bottom-color: rgba(30,26,20,.06); box-shadow: 0 14px 28px -24px rgba(28,24,18,.32); }

  /* Νύχτα: το μενού γραφίτης αντί για ναυτικό. */
  :root[data-bg="graphite"][data-theme="dark"] .sidebar {
    background: linear-gradient(180deg, rgba(20,20,24,.82), rgba(13,13,16,.88));
    border-right-color: rgba(255,255,255,.06);
    box-shadow: inset -1px 0 0 rgba(0,0,0,.6);
  }
  :root[data-bg="graphite"][data-theme="dark"] .topbar { border-bottom-color: rgba(255,255,255,.05); box-shadow: 0 14px 28px -24px rgba(0,0,0,.9); }
  :root[data-bg="graphite"][data-theme="dark"] { --wx-head: rgba(26,26,31,.96); }

  /* Το μήνυμα κάτω: γραφίτης μέρα και νύχτα (ήταν ναυτικό και στα δύο). */
  :root[data-bg="graphite"] .toast { background: rgba(26,26,31,.94); }

  /* Γράμματα πάνω σε χρυσό: το σταθερό ναυτικό #0a192f γίνεται το σκούρο του χρυσού κουμπιού. */
  :root[data-bg="graphite"] :is(.day.today .day-dow, .day.today .day-n, .pchip.on .pcount, .pchip.nodriver.on .pcount,
    .rangeday.edge, .mx-cell.l4, .hm-need:hover .hm-need-go, .hm-wk-d.is-today .hm-wk-dd, .moved-bar) { color: #1a1406; }
  :root[data-bg="graphite"] .day.today .day-c { background: rgba(26,20,6,.14); color: #1a1406; }
}
@media screen and (prefers-color-scheme: dark) {
  :root[data-bg="graphite"]:not([data-theme="light"]) .sidebar {
    background: linear-gradient(180deg, rgba(20,20,24,.82), rgba(13,13,16,.88));
    border-right-color: rgba(255,255,255,.06);
    box-shadow: inset -1px 0 0 rgba(0,0,0,.6);
  }
  :root[data-bg="graphite"]:not([data-theme="light"]) .topbar { border-bottom-color: rgba(255,255,255,.05); box-shadow: 0 14px 28px -24px rgba(0,0,0,.9); }
  :root[data-bg="graphite"]:not([data-theme="light"]) { --wx-head: rgba(26,26,31,.96); }
}

/* ══ ΑΡΧΙΚΑ ΧΩΡΙΣ ΦΩΤΟΓΡΑΦΙΑ: ΓΚΡΙ (24.10.2026, «κάνε το γκρι») ══════════════════════════════════════════
   Το χρώμα τους (ναυτικό ή χρυσό, ανά όνομα) μπαίνει από τη JavaScript ΠΑΝΩ στο στοιχείο (core/fmt.js colorFor,
   core/ui.js avatar/photoChip), γι' αυτό το !important. Πιάνει ΜΟΝΟ όσα έχουν `background: rgb(...)`: οι
   φωτογραφίες και τα λογότυπα συνεργατών μπαίνουν ως background-image και δεν αγγίζονται.
   Μέρα: λευκά γράμματα σε γκρι 5,3:1 · νύχτα: υπόλευκα σε γραφίτη 10:1. */
@media screen {
  :root[data-bg="graphite"] :is(.av, .pimg)[style*="background: rgb"] { background: #6e6a64 !important; color: #fff !important; }
  :root[data-bg="graphite"][data-theme="dark"] :is(.av, .pimg)[style*="background: rgb"] { background: #3a3a41 !important; color: #f5efe5 !important; }
}
@media screen and (prefers-color-scheme: dark) {
  :root[data-bg="graphite"]:not([data-theme="light"]) :is(.av, .pimg)[style*="background: rgb"] { background: #3a3a41 !important; color: #f5efe5 !important; }
}