/* ═══════════════ Φάση 2: προμηθευτές, εκκαθαρίσεις, πληρωμές ═══════════════ */
.chip:has(input:checked) { border: 2px solid #6C5CF5; background: rgba(108, 92, 245, .1); color: var(--primary-hover); font-weight: 700; }
.chip input[type=radio] { position: absolute; opacity: 0; width: 1px; height: 1px; }
.chip:has(input:focus-visible) { outline: 3px solid var(--sky); outline-offset: 2px; }
.btn[disabled] { cursor: not-allowed; }
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 14px; }
.stat { border-radius: 22px; padding: 18px; background: var(--glass); border: 1px solid var(--glass-line); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); display: flex; flex-direction: column; gap: 4px; }
.stat span { font-size: 13px; font-weight: 700; color: var(--ink-2); }
.stat strong { font-size: 28px; font-weight: 800; letter-spacing: -.6px; }
.stat small { font-size: 12px; color: var(--muted); }
.stat.hero { background: linear-gradient(140deg, rgba(52, 211, 153, .18), rgba(56, 189, 248, .18)); }

.kv { display: grid; grid-template-columns: 110px 1fr; gap: 6px 12px; font-size: 14px; margin: 0; }
.kv dt { color: var(--muted); }
.kv dd { margin: 0; font-weight: 700; overflow-wrap: anywhere; }
.billing { border-radius: 16px; padding: 14px 16px; background: rgba(108, 92, 245, .08); }

.steps { list-style: none; margin: 0; padding: 6px; display: flex; flex-wrap: wrap; gap: 4px; border-radius: 99px; background: rgba(255, 255, 255, .6); border: 1px solid rgba(255, 255, 255, .9); }
.steps li { padding: 8px 14px; border-radius: 99px; font-size: 13px; font-weight: 700; color: var(--muted); }
.steps li.done { background: rgba(52, 211, 153, .2); color: #0F6B4B; }
.steps li.now { background: linear-gradient(135deg, #5B4BEA, var(--primary-2)); color: #fff; }

.line-row { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; padding: 12px 14px; border-radius: 18px; background: rgba(255, 255, 255, .7); border: 1px solid rgba(255, 255, 255, .95); }
.line-row .bar { width: 10px; height: 40px; border-radius: 6px; flex: none; }
.line-row .what { flex: 1 1 200px; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.line-row .what span { font-size: 13px; color: var(--muted); }
.line-row .sum { min-width: 100px; text-align: right; font-weight: 800; font-size: 16px; }
.stepper { display: flex; align-items: center; gap: 6px; background: #fff; border-radius: 14px; padding: 4px; box-shadow: 0 2px 8px rgba(40, 44, 90, .06); }
.stepper button { width: 40px; height: 40px; border: 0; border-radius: 10px; background: #F1F3FA; color: var(--ink); font: inherit; font-size: 20px; font-weight: 700; cursor: pointer; }
.stepper button:hover { background: #E6E9F5; }
.stepper input { width: 64px; height: 40px; border: 0; text-align: center; font: inherit; font-size: 17px; font-weight: 800; color: var(--ink); background: transparent; -moz-appearance: textfield; }
.stepper input::-webkit-outer-spin-button, .stepper input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.summary-total { border-radius: 18px; padding: 16px; background: linear-gradient(135deg, rgba(56, 189, 248, .14), rgba(139, 92, 246, .14)); display: flex; flex-direction: column; gap: 2px; }
.summary-total span { font-size: 13px; font-weight: 600; color: var(--ink-2); }
.summary-total strong { font-size: 34px; font-weight: 800; letter-spacing: -.8px; }
.sumrow { display: flex; justify-content: space-between; gap: 10px; font-size: 15px; }
.sumrow span { color: var(--muted); }
.aside { flex: 1 1 300px; min-width: 280px; align-self: flex-start; }

.price-grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1.4fr) minmax(0, 1fr) 44px; gap: 8px; align-items: center; }
.price-grid .head { font-size: 12px; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .4px; }
.price-grid .input { height: 46px; min-width: 0; }
.price-item { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; padding: 10px 14px; border-radius: 16px; background: rgba(255, 255, 255, .7); }
.price-item.old { background: rgba(23, 26, 51, .03); opacity: .75; }
.price-item .what { flex: 1 1 200px; min-width: 0; display: flex; flex-direction: column; }
.price-item .what span { font-size: 12px; color: var(--muted); }
.price-item .amount { min-width: 80px; text-align: right; font-weight: 800; font-size: 16px; }
details.inline > summary { list-style: none; cursor: pointer; }
details.inline > summary::-webkit-details-marker { display: none; }

.drop { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; min-height: 180px; padding: 18px; border-radius: 20px; border: 2px dashed rgba(108, 92, 245, .45); background: linear-gradient(135deg, rgba(56, 189, 248, .08), rgba(139, 92, 246, .10)); cursor: pointer; text-align: center; transition: background .15s, border-color .15s; }
.drop:hover, .drop.over, .drop:focus-within { background: rgba(255, 255, 255, .95); border-color: #6C5CF5; }
.drop .ic { width: 58px; height: 58px; border-radius: 18px; background: linear-gradient(135deg, var(--sky), #6C5CF5); display: flex; align-items: center; justify-content: center; box-shadow: 0 8px 20px rgba(108, 92, 245, .3); }
.drop strong { font-size: 16px; }
.drop span { font-size: 13px; color: var(--muted); }
.drop input[type=file] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.drop.small { min-height: 90px; flex-direction: row; justify-content: flex-start; text-align: left; }
.drop.small .ic { width: 48px; height: 48px; flex: none; }
.file-chip { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 14px; background: #fff; text-decoration: none; color: var(--ink); }
.file-chip .ft { width: 40px; height: 40px; flex: none; border-radius: 12px; background: var(--coral); color: #fff; font-size: 11px; font-weight: 800; display: flex; align-items: center; justify-content: center; }
.file-chip .ft.v { background: var(--violet); }
.file-chip .ft.g { background: #10B981; }
.file-chip span { display: flex; flex-direction: column; min-width: 0; }
.file-chip small { font-size: 12px; color: var(--muted); }

.queue-card { display: flex; flex-direction: column; gap: 10px; width: 100%; padding: 16px; border-radius: 20px; text-decoration: none; color: var(--ink); border: 1px solid var(--glass-line); background: var(--glass); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); box-shadow: 0 8px 24px rgba(40, 44, 90, .06); transition: transform .15s; }
.queue-card:hover { transform: translateY(-2px); color: var(--ink); }
.queue-card[aria-current="true"] { border: 2px solid var(--primary); background: #fff; box-shadow: 0 12px 30px rgba(75, 63, 216, .18); }
.queue-card .top { display: flex; justify-content: space-between; gap: 10px; }
.queue-card .top div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.queue-card .top span { font-size: 13px; color: var(--muted); }

.copy-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.copy-row div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.copy-row span { font-size: 12px; color: var(--muted); }
.copy-row strong { font-size: 14px; overflow-wrap: anywhere; }

.done-box { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 22px; border-radius: 20px; background: linear-gradient(135deg, rgba(52, 211, 153, .16), rgba(56, 189, 248, .12)); text-align: center; }
.done-box strong { font-size: 20px; }
.timeline { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.timeline li { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 14px; font-size: 14px; }
.timeline li.ok { background: rgba(52, 211, 153, .14); }
.timeline li.now { background: rgba(108, 92, 245, .10); }
.timeline li.later { background: #F4F5FA; color: var(--muted); }

.hero-sum { font-size: 40px; font-weight: 800; letter-spacing: -1px; color: var(--primary-2); }
.public-wrap { position: relative; max-width: 940px; margin: 0 auto; padding: 28px 16px 56px; display: flex; flex-direction: column; gap: 22px; }
.public-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.public-head .who { display: flex; align-items: center; gap: 14px; }
.public-head .who img { width: 150px; height: auto; }
.public-head .who i { width: 1px; height: 26px; background: rgba(23, 26, 51, .18); }
.pill { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 99px; background: rgba(255, 255, 255, .7); border: 1px solid rgba(255, 255, 255, .95); font-size: 13px; font-weight: 600; color: var(--ink-2); }
.banner { position: relative; overflow: hidden; border-radius: 26px; min-height: 180px; display: flex; align-items: center; box-shadow: 0 18px 50px rgba(67, 56, 202, .22); background: radial-gradient(45% 140% at 88% 20%, #F59E0B, transparent 60%), radial-gradient(40% 140% at 62% 110%, #0D9488, transparent 60%), radial-gradient(40% 140% at 100% 100%, #DC2626, transparent 60%), #1E1B4B; }
.banner .ov { position: absolute; inset: 0; }
.banner.indigo .ov { background: linear-gradient(100deg, rgba(23, 26, 51, .94) 0%, rgba(67, 56, 202, .74) 50%, rgba(67, 56, 202, .10) 100%); }
.banner.sea .ov { background: linear-gradient(100deg, rgba(8, 47, 73, .94) 0%, rgba(2, 132, 199, .72) 50%, rgba(13, 148, 136, .10) 100%); }
.banner.sunset .ov { background: linear-gradient(100deg, rgba(76, 5, 25, .93) 0%, rgba(190, 24, 93, .70) 50%, rgba(234, 88, 12, .12) 100%); }
.banner .mark { position: absolute; right: -30px; top: 50%; width: 260px; height: 260px; margin-top: -130px; transform: rotate(-12deg); }
.banner .in { position: relative; width: 100%; padding: 30px 34px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px; }
.banner h2 { color: #fff; font-size: 25px; font-weight: 800; }
.banner p { margin: 6px 0 0; color: #E4E6F5; font-size: 15px; }
.banner a { display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 22px; border-radius: 99px; background: #fff; color: var(--primary-hover); font-weight: 700; text-decoration: none; }
.public-foot { border-radius: 26px; padding: 30px 28px; background: linear-gradient(135deg, rgba(23, 26, 51, .95), rgba(43, 38, 96, .93)); display: flex; flex-direction: column; align-items: center; gap: 14px; text-align: center; color: #D5D8EA; font-size: 13px; }
.public-foot strong { color: #fff; font-size: 14px; }
.public-foot img { width: 160px; height: auto; }
.public-foot a { color: #fff; font-weight: 600; text-decoration: none; font-size: 14px; }
.public-foot hr { width: 60px; border: 0; height: 1px; background: rgba(255, 255, 255, .2); margin: 0; }
