/* ============================================================================
   Clubora — modal νέας κράτησης (A4), drag & resize στο ημερολόγιο (A2)
   και οθόνη σύνδεσης.
   ============================================================================ */

/* ── Modal ────────────────────────────────────────────────────────────────── */

.c-scrim {
	position: fixed;
	inset: 0;
	z-index: 900;
	background: rgba(4, 4, 6, 0.55);
	/* Το ημερολόγιο από πίσω σκοτεινιάζει αντί να κρύβεται (design handoff A4). */
	backdrop-filter: brightness(0.42);
}

.c-modal {
	position: fixed;
	top: 50%;
	left: 50%;
	z-index: 901;
	width: 640px;
	max-width: calc(100vw - 48px);
	max-height: calc(100vh - 64px);
	overflow-y: auto;
	transform: translate(-50%, -50%);
	background: var(--modal-bg);
	border: 1px solid var(--border-strong);
	border-radius: var(--r-modal);
	box-shadow: var(--sh-modal);
}

.c-modal__head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
	padding: 22px 26px 16px;
	border-bottom: 1px solid var(--hairline);
}

.c-modal__title {
	font-size: 19px;
	font-weight: 800;
	letter-spacing: -0.02em;
}

.c-modal__sub {
	margin-top: 4px;
	font-size: 12px;
	color: var(--text-muted);
}

.c-modal__body {
	padding: 18px 26px 22px;
}

.c-modal__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
	margin-top: 16px;
}

.c-modal__grid .c-label {
	margin-bottom: 7px;
}

.c-select--wide {
	width: 100%;
}

.c-readonly {
	padding: 7px 11px;
	border: 1px solid var(--hairline);
	border-radius: 9px;
	color: var(--text-muted);
	font-size: 13px;
	font-weight: 600;
}

.c-modal__duration {
	margin-top: 18px;
}

.c-note-accent {
	margin-left: 10px;
	color: var(--a);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0;
	text-transform: none;
}

.c-durchips {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 8px;
	margin-top: 9px;
}

.c-durchip {
	padding: 10px 0;
	border: 1px solid var(--border);
	border-radius: var(--r-chip);
	background: transparent;
	color: var(--text-2);
	font-size: 14px;
	cursor: pointer;
	transition: background var(--t-state), border-color var(--t-state);
}

.c-durchip:hover {
	border-color: var(--border-strong);
}

.c-durchip.selected {
	background: var(--a-soft);
	border-color: var(--a-line);
	color: var(--a);
	font-weight: 700;
}

.c-modal__total {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 16px;
	margin-top: 22px;
	padding-top: 16px;
	border-top: 1px dashed var(--border);
}

.c-modal__basis {
	font-size: 11px;
	color: var(--text-muted);
}

.c-modal__amount {
	font-size: 24px;
	font-weight: 800;
}

.c-modal__foot {
	display: flex;
	justify-content: flex-end;
	gap: 10px;
	padding: 16px 26px 22px;
	border-top: 1px solid var(--hairline);
}

/* ── Drag & resize στο ημερολόγιο ─────────────────────────────────────────── */

.c-block {
	cursor: grab;
}

.c-block:active {
	cursor: grabbing;
}

/* Λαβή αλλαγής διάρκειας στο κάτω άκρο του μπλοκ. */
.c-block__resize {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	height: 7px;
	cursor: ns-resize;
}

.c-block__resize:hover {
	background: var(--a-line);
}

/* Όσο σέρνεται κάτι, οι στήλες δείχνουν ότι δέχονται drop. */
.c-cal__col.is-droptarget {
	outline: 1px dashed var(--a-line);
	outline-offset: -1px;
}

.c-cal__col {
	cursor: copy;
}

.c-detail-actions {
	display: flex;
	gap: 8px;
	margin-top: 14px;
}

/* ── Οθόνη σύνδεσης ───────────────────────────────────────────────────────── */

.c-login {
	display: grid;
	place-items: center;
	min-height: 100vh;
	padding: 24px;
	background: var(--bg);
}

.c-login__panel {
	width: 100%;
	max-width: 380px;
}

.c-login__logo {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border-radius: 13px;
	background: var(--a);
	color: var(--on-a);
	font-size: 26px;
	font-weight: 800;
}

.c-login__headline {
	margin-top: 44px;
	font-size: 42px;
	font-weight: 800;
	line-height: 1.02;
	letter-spacing: -0.045em;
}

.c-login__headline span {
	color: var(--text-faint);
}

.c-login__fields {
	margin-top: 56px;
}

/* Πεδία με υπογράμμιση, χωρίς πλαίσιο (design handoff, οθόνη 01). */
.c-field {
	margin-bottom: 26px;
}

.c-field__label {
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--text-dim);
}

.c-field input {
	width: 100%;
	padding: 8px 0;
	background: transparent;
	border: 0;
	border-bottom: 1px solid var(--border);
	outline: 0;
	color: var(--text);
	font: 600 15px var(--font-ui);
}

.c-field input:focus {
	border-bottom-color: var(--a);
}

.c-field:focus-within .c-field__label {
	color: var(--a);
}

.c-login__error {
	margin-bottom: 18px;
	color: var(--a);
	font-size: 13px;
	font-weight: 600;
}

.c-login__submit {
	width: 100%;
	height: 52px;
	border: 0;
	border-radius: var(--r-pill);
	background: var(--a);
	color: var(--on-a);
	font-size: 16px;
	font-weight: 700;
	cursor: pointer;
}

.c-login__submit:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}

.c-login__hint {
	margin-top: 22px;
	font-size: 12px;
	color: var(--text-dim);
	text-align: center;
}