/* ============================================================================
   contract.css — ΤΟ ΣΥΜΦΩΝΗΤΙΚΟ, ΜΕΤΑΦΕΡΜΕΝΟ ΑΥΤΟΥΣΙΟ.

   Είναι οι κανόνες `.paper` του `Apps/docs/contract.html` (γραμμές 77-122),
   με δύο μόνο αλλαγές, και τις δύο για μέγεθος:
     • η σφραγίδα και η υπογραφή βγήκαν από base64 σε assets/img/
     • το `.paper` έγινε `.escontract`, για να μη συγκρούεται με την εφαρμογή

   ΜΗΝ «ΤΑΚΤΟΠΟΙΗΣΕΙΣ» ΑΥΤΟ ΤΟ ΑΡΧΕΙΟ. Τυπώνεται σε χαρτί και υπογράφεται.

   ΤΑ TOKENS ΖΟΥΝ ΠΑΝΩ ΣΤΟ ΙΔΙΟ ΤΟ ΦΥΛΛΟ, όπως και στο voucher.css: το έγγραφο
   ΔΕΝ ακολουθεί το θέμα της εφαρμογής. Ένα συμφωνητικό σε νυχτερινό μπλε δεν
   υπάρχει — το χαρτί είναι πάντα χαρτί.
   ========================================================================== */

.escontract {
  --ink:#0C2230; --ink-soft:#13313f;
  --brass:#B08D2F; --brass-deep:#8C6C28; --brass-lt:#C9A84C; --gold-hi:#E8CF9E;
  --paper:#FBF9F4; --stone-line:#E7DFCF;
  --text:#1C2A30; --muted:#5C6A6E;
  --c-serif:Georgia,'Times New Roman','Liberation Serif','DejaVu Serif',serif;
  --c-sans:system-ui,-apple-system,'Segoe UI',Roboto,'Liberation Sans','DejaVu Sans',Helvetica,Arial,sans-serif;
  --c-mono:ui-monospace,Menlo,Consolas,'DejaVu Sans Mono','Liberation Mono',monospace;

  width:210mm; min-height:297mm; box-sizing:border-box; padding:8mm 15mm 12mm;
  background:var(--paper); color:var(--text);
  font-family:var(--c-sans); font-size:12px; line-height:1.5;
  transform-origin:top left; box-shadow:0 10px 34px rgba(12,34,48,.17);
  -webkit-print-color-adjust:exact; print-color-adjust:exact;
}

.escontract .brandbar{ background:linear-gradient(180deg,var(--ink) 0%,var(--ink-soft) 100%); border-radius:12px; padding:16px 30px 15px; text-align:center; color:#fff; }
.escontract .es-logo{ width:132px; height:52px; margin:0 auto 9px; background:url('../img/contract-logo.png') center/contain no-repeat; }
.escontract .gold-rule{ width:46px; height:2px; margin:0 auto 10px; background:linear-gradient(90deg,transparent,var(--brass-lt),transparent); }
.escontract .brand-name{ font-family:var(--c-serif); font-size:16px; letter-spacing:.03em; color:var(--gold-hi); }
.escontract .brand-sub{ font-size:10px; letter-spacing:.05em; color:#B9A063; margin-top:5px; }
.escontract .brand-meta{ font-size:8.3px; letter-spacing:.05em; color:#8698A1; margin-top:6px; }
.escontract .brand-contact{ font-size:9.8px; letter-spacing:.02em; color:#E4DED2; margin-top:7px; font-weight:600; }
.escontract .brand-contact .g{ color:var(--brass-lt); }

.escontract .title-wrap{ text-align:center; margin:16px 0 3px; }
.escontract .doc-title{ font-family:var(--c-serif); font-size:26px; font-weight:500; letter-spacing:.05em; color:var(--ink); margin:6px 0 0; }
.escontract .title-rule{ width:64px; height:2px; margin:10px auto 0; background:linear-gradient(90deg,transparent,var(--brass),transparent); }

.escontract .sec-label{ text-align:center; font-family:var(--c-serif); font-weight:700; font-size:11.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--brass-deep); margin:13px 0 6px; }
.escontract .center-lede{ text-align:center; font-family:var(--c-serif); font-size:13px; color:var(--text); margin:0; }

.escontract .party{ font-size:12px; line-height:1.52; text-align:justify; margin:0; }
.escontract .party strong{ font-weight:700; color:var(--ink); }

.escontract .agreed{ text-align:center; font-family:var(--c-serif); font-weight:700; font-size:14px; letter-spacing:.14em; color:var(--brass-deep); margin:13px 0 6px; }

.escontract .clause{ margin-top:12px; }
.escontract .clause-h{ font-family:var(--c-serif); font-weight:700; font-size:13px; letter-spacing:.05em; text-transform:uppercase; color:var(--ink); margin:0 0 7px; padding-left:16px; position:relative; }
.escontract .clause-h:before{ content:""; position:absolute; left:0; top:.42em; width:7px; height:7px; background:var(--brass); transform:rotate(45deg); }
.escontract .body{ font-size:12px; line-height:1.52; text-align:justify; margin:0 0 6px; }
.escontract .body strong{ font-weight:700; color:var(--ink); }

.escontract .closing{ font-family:var(--c-serif); font-style:italic; font-size:12px; line-height:1.5; color:var(--muted); text-align:center; margin:13px 0 0; }

.escontract .sign-rule{ height:1px; margin:12px 0 0; background:linear-gradient(90deg,transparent,var(--stone-line) 14%,var(--stone-line) 86%,transparent); }
/* ⚠ align-items: FLEX-START, όχι flex-end. Με στοίχιση στο κάτω μέρος, η
   στήλη με το λιγότερο κείμενο από κάτω σπρώχνει τη γραμμή της πιο χαμηλά —
   αρκεί να λείπει το όνομα του οδηγού και οι δύο γραμμές ξεχωρίζουν 16px. */
.escontract .sig-row{ display:flex; gap:40px; margin-top:14px; align-items:flex-start; }
.escontract .sig{ flex:1 1 0; text-align:center; padding:0 6px; }

/* Ο χώρος υπογραφής: ΣΤΑΘΕΡΟ ύψος, γεμάτος ή άδειος. Αυτό κρατά τις δύο
   γραμμές στο ίδιο ύψος και εμποδίζει τη γραμμή να ανέβει όταν φύγει η
   σφραγίδα. Το περιεχόμενο κάθεται στο ΚΑΤΩ μέρος, ακουμπώντας τη γραμμή. */
.escontract .sig-marks{
  height:120px; display:flex; flex-direction:column;
  align-items:center; justify-content:flex-end;
}
.escontract .sig .stamp{ display:block; width:140px; max-height:64px; object-fit:contain; margin:0 auto 8px; }
.escontract .sig .sign{ display:block; width:140px; max-height:44px; object-fit:contain; margin:0 auto 4px; }
/* Η χειρόγραφη υπογραφή του οδηγού — ίδιο κάδρο με την εταιρική. */
.escontract .sig .handsign{ display:block; width:150px; max-height:74px; object-fit:contain; margin:0 auto 4px; }
.escontract .sig-line{ height:1px; background:#9AA7AC; margin:0 16px; }
.escontract .sig-role{ font-family:var(--c-mono); font-size:9.5px; letter-spacing:.15em; text-transform:uppercase; color:var(--brass-deep); }
.escontract .sig-name{ font-family:var(--c-serif); font-size:12.5px; color:var(--ink); margin-top:3px; }

/* ── Η οθόνη γύρω από το φύλλο ───────────────────────────────────────────── */
.contract-wrap { display: grid; grid-template-columns: 392px minmax(0, 1fr); gap: var(--s5); align-items: start; }
@media (max-width: 900px) { .contract-wrap { grid-template-columns: 1fr; } }

.contract-frame { position: relative; overflow: hidden; justify-self: center; }
.contract-mat {
  background: var(--bg2); border: 1px solid var(--line-2); border-radius: var(--r);
  padding: var(--s5); display: flex; justify-content: center; overflow-x: auto;
}
.contract-actions { display: flex; flex-direction: column; gap: var(--s2); margin-top: var(--s4); }
.contract-actions .btn { width: 100%; }
.contract-actions .btn-reset { width: auto; align-self: flex-start; }
.contract-warn { color: var(--crit); font-size: var(--fs-xs); margin-top: 5px; }
.contract-warn.ok { color: var(--ok); }
.contract-hint {
  font-size: var(--fs-xs); color: var(--muted); margin-top: var(--s4); line-height: 1.55;
  background: var(--gold-soft); border: 1px solid var(--line-2);
  border-radius: var(--r-sm); padding: 11px 13px;
}

/* ── Εκτύπωση ────────────────────────────────────────────────────────────────
   Ίδια λογική με το voucher: ό,τι δεν είναι το φύλλο δεν τυπώνεται. Το
   print-color-adjust είναι υποχρεωτικό — ο browser ΠΕΤΑΕΙ τα φόντα και τις
   background-images στην εκτύπωση, και η ναυτική κεφαλίδα είναι background. */
@media print {
  /* ⚠ ΤΟ `@page` ΕΦΥΓΕ (10.09.2026) — είναι ΚΑΘΟΛΙΚΟ και μηδένιζε το
     περιθώριο σε ΚΑΘΕ εκτύπωση. Μπαίνει δυναμικά από τον `printSheet()`
     (views/voucher.js) μόνο όση ώρα τυπώνεται φύλλο. ΜΗΝ ΤΟ ΞΑΝΑΒΑΛΕΙΣ. */
  html, body { background: #fff !important; margin: 0 !important; padding: 0 !important; }
  .escontract.printing {
    transform: none !important; width: 210mm !important; max-width: 210mm !important;
    margin: 0 !important; box-shadow: none !important;
    break-inside: avoid; page-break-inside: avoid;
  }
  .escontract.printing, .escontract.printing * {
    -webkit-print-color-adjust: exact; print-color-adjust: exact;
  }
  .escontract.printing ~ *, .no-print { display: none !important; }
}

/* Το δεύτερο κουμπί ενέργειας — χρυσό περίγραμμα, όχι γεμάτο: η κύρια
   ενέργεια της οθόνης είναι η εκτύπωση, αυτό έρχεται δεύτερο. */
.btn-goldline {
  background: var(--gold-soft); color: var(--gold-text); border-color: var(--gold);
}
.btn-goldline:hover { background: var(--gold-soft2); }
.btn-goldline:disabled { opacity: .6; cursor: default; }

.contract-more { margin-top: var(--s2); }
.contract-more > summary {
  cursor: pointer; font-size: var(--fs-sm); font-weight: 600; color: var(--muted);
  padding: var(--s2) 0; list-style: none;
}
.contract-more > summary::-webkit-details-marker { display: none; }
.contract-more > summary::before { content: '▸ '; color: var(--gold-text); }
.contract-more[open] > summary::before { content: '▾ '; }
.contract-more > summary:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }

/* ── Ο καμβάς υπογραφής ─────────────────────────────────────────────────────
   Μεγάλος επίτηδες: υπογραφή με το δάχτυλο θέλει χώρο. Το `touch-action: none`
   είναι ΥΠΟΧΡΕΩΤΙΚΟ — χωρίς αυτό το δάχτυλο κυλά τη σελίδα αντί να γράφει. */
.sigpad-wrap {
  position: relative; height: 280px; width: 100%;
  /* ⚠ ΧΑΡΤΙ, ΟΧΙ ΘΕΜΑ. Το μελάνι είναι σκούρο ναυτικό (#0C2230) γιατί έτσι
     τυπώνεται. Πάνω σε σκούρο φόντο νύχτας θα υπέγραφες ΣΤΑ ΤΥΦΛΑ. Η
     επιφάνεια υπογραφής μένει ανοιχτή πάντα, όπως και η προεπισκόπηση του
     χαρτιού — είναι χαρτί, δεν είναι διεπαφή. */
  color-scheme: light;
  background: #FBF9F4; border: 1px solid #E7DFCF;
  border-radius: var(--r-sm); overflow: hidden;
}
.sigpad { position: absolute; inset: 0; touch-action: none; cursor: crosshair; display: block; }
/* Η γραμμή πάνω στην οποία υπογράφει — δείχνει πού να γράψει. */
.sigpad-base {
  position: absolute; inset-inline: 12%; inset-block-end: 58px; height: 1px;
  background: #9AA7AC; pointer-events: none;
}
@media (max-width: 620px) { .sigpad-wrap { height: 220px; } }

/* Η προεπισκόπηση δείχνει σκούρο μελάνι — θέλει κι αυτή ανοιχτό υπόβαθρο. */
.signpreview {
  height: 40px; width: auto; max-width: 180px; object-fit: contain;
  border: 1px solid var(--line-2); border-radius: var(--r-xs);
  background: #FBF9F4; padding: 2px 6px;
}

/* ── NDA (08.10.2026) — ίδιο χαρτί, ΕΤΟΙΜΕΣ σελίδες Α4 με αριθμό ─────────────
   Το συμφωνητικό χωράει σε ΜΙΑ σελίδα· το NDA όχι. Το views/nda-paginate.js το μοιράζει σε `.nda-page`
   (210×297mm, `overflow:hidden` στο σώμα = μέτρο του «χωράει;») και γράφει «Page X of Y» στο κάτω μέσο.
   «try to fit it in 3 pages» → πιο σφιχτά από το συμφωνητικό: 11px κείμενο, μικρότερη κεφαλίδα/κενά. */
.nda-pages{ display:flex; flex-direction:column; gap:18px; width:210mm; transform-origin:top left; }
.escontract.nda-page{
  width:210mm; height:297mm; min-height:0; padding:9mm 14mm 0; display:flex; flex-direction:column;
  overflow:hidden; font-size:11px; line-height:1.42;
}
.escontract .nda-body{ flex:1 1 auto; min-height:0; overflow:hidden; }
.escontract .nda-foot{ flex:0 0 13mm; display:flex; align-items:center; justify-content:center;
  font-family:var(--c-mono); font-size:9px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); }
.escontract.nda .brandbar{ padding:12px 26px 11px; border-radius:10px; }
.escontract.nda .es-logo{ height:44px; margin-bottom:7px; }
.escontract.nda .title-wrap{ margin:11px 0 2px; }
.escontract.nda .doc-title{ font-size:21px; }
.escontract.nda .title-rule{ margin-top:7px; }
.escontract.nda .sec-label{ font-size:10.5px; margin:8px 0 4px; }
.escontract.nda .center-lede{ font-size:12px; }
.escontract.nda .party{ font-size:11px; line-height:1.42; }
.escontract.nda .agreed{ font-size:12.5px; margin:9px 0 4px; }
.escontract.nda .lede{ font-size:11px; line-height:1.42; text-align:justify; margin:0; }
.escontract.nda .clause{ margin-top:7px; }
.escontract.nda .clause-h{ font-size:11px; margin-bottom:3px; }
.escontract.nda .body{ font-size:11px; line-height:1.42; margin:0 0 2px; }
.escontract.nda .legal{ font-size:8.8px; line-height:1.4; color:var(--muted); margin:2px 0 0; padding:2px 0 2px 9px; border-left:2px solid var(--stone-line); }
.escontract.nda .legal b{ font-family:var(--c-mono); font-size:8px; letter-spacing:.12em; text-transform:uppercase; color:var(--brass-deep); font-weight:600; margin-right:4px; }
.escontract.nda .blank{ display:inline-block; min-width:110px; border-bottom:1px solid #9AA7AC; height:1em; vertical-align:baseline; }
.escontract.nda .closing{ font-size:11px; margin:9px 0 0; }
.escontract.nda .sig-row{ margin-top:8px; }
.escontract.nda .sig-marks{ height:96px; }

/* Εκτύπωση: κάθε σελίδα ΜΙΑ σελίδα χαρτιού (το `printSheet` βάζει @page Α4 χωρίς περιθώριο όσο τυπώνει). */
@media print {
  .nda-pages.printing{ transform:none !important; gap:0 !important; width:210mm !important; margin:0 !important; }
  .nda-pages.printing .nda-page{ box-shadow:none !important; break-after:page; page-break-after:always; }
  .nda-pages.printing .nda-page:last-child{ break-after:auto; page-break-after:auto; }
  .nda-pages.printing, .nda-pages.printing *{ -webkit-print-color-adjust:exact; print-color-adjust:exact; }
}

/* ── Σύμβαση συνεργασίας (08.10.2026) — Παράρτημα τιμοκαταλόγου ───────────────
   Κάθε γραμμή είναι ΞΕΧΩΡΙΣΤΟ μπλοκ (nda-paginate κόβει ανάμεσα σε γραμμές)· ίδιο ύφος με τις κάρτες της
   οθόνης «Τιμές», αλλά σε χαρτί: ναυτικό στην κεφαλίδα, ζέβρα, αριθμοί δεξιά. */
.escontract .sig-co{ font-size:8.5px; line-height:1.45; color:var(--muted); margin-top:3px; }
.escontract .annex-title{ text-align:center; margin:4px 0 6px; }
.escontract .annex-title .doc-title{ font-size:18px; }
.escontract .annex-title .title-rule{ margin:7px auto 6px; }
.escontract .pt-h{ font-family:var(--c-serif); font-weight:700; font-size:11px; letter-spacing:.05em; text-transform:uppercase; color:var(--ink); margin:12px 0 5px; }
.escontract .pt-row{ display:grid; grid-template-columns:minmax(0,1fr) repeat(var(--n,2), minmax(64px, auto)); gap:10px; align-items:center;
  padding:4px 10px; font-size:10.5px; line-height:1.35; border-left:1px solid var(--stone-line); border-right:1px solid var(--stone-line); border-bottom:1px solid var(--stone-line); }
.escontract .pt-row.zebra{ background:rgba(176,141,47,.06); }
.escontract .pt-th{ background:var(--ink); color:#fff; font-weight:600; font-size:9.5px; letter-spacing:.04em; border-radius:6px 6px 0 0; border-color:var(--ink); }
.escontract .pt-row .v{ text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
.escontract .pt-row .pt-wide{ grid-column:2 / -1; color:var(--muted); white-space:normal; }
.escontract .pt-from{ font-size:8.5px; font-weight:700; color:var(--muted); }
.escontract .pt-note-row{ font-size:8.5px; color:var(--muted); }
.escontract .pt-note{ font-size:9px; line-height:1.4; color:var(--muted); margin:4px 0 0; }

/* Ο επιλογέας τιμοκαταλόγων στη φόρμα (οθόνη, όχι χαρτί). */
.pt-pick{ display:grid; gap:2px; max-height:260px; overflow-y:auto; border:1px solid var(--line-2); border-radius:var(--r-sm); padding:6px 10px; }
.pt-pick-g{ font-size:var(--fs-xs); font-weight:700; color:var(--gold-text); margin-top:6px; }
.pt-pick-row{ display:flex; align-items:center; gap:8px; padding:4px 0; cursor:pointer; font-size:var(--fs-sm); }
.pt-pick-row input{ width:17px; height:17px; margin:0; }

/* (22.10.2026) Το ΔΙΚΟ ΤΗΣ λογότυπο μιας εταιρείας (core/identity-contracts.js): η ΛΕΥΚΗ, διάφανη εκδοχή του, κατευθείαν
   στη ναυτική κεφαλή — όπως το χρυσό σήμα της Exclusive. */
.escontract .own-logo, .nda-pages .own-logo{ width:160px; height:56px; margin:0 auto 9px; display:flex; align-items:center; justify-content:center; }
.escontract .own-logo img, .nda-pages .own-logo img{ max-width:100%; max-height:100%; object-fit:contain; display:block; }