/**
 * ASI Bari Core – stili dei componenti.
 * Personalizzabili dal tema sovrascrivendo le custom properties su :root.
 */
:root {
	--asi-primary: #0b5cad;
	--asi-primary-dark: #084785;
	--asi-text: #1d2733;
	--asi-muted: #5c6875;
	--asi-border: #d5dbe1;
	--asi-bg-soft: #f4f6f8;
	--asi-error: #b3261e;
	--asi-success: #1e7d32;
	--asi-warning: #9a6700;
	--asi-libero: #2e7d32;
	--asi-occupato: #b71c1c;
	--asi-radius: 8px;
	--asi-radius-sm: 6px;
	--asi-radius-lg: 12px;
	--asi-radius-pill: 999px;
	--asi-surface: #fff;
	--asi-on-primary: #fff;
	--asi-error-bg: #fdecea;
	--asi-success-bg: #e8f5e9;
	--asi-warning-bg: #fff8e1;
	--asi-chat-me-bg: #e3effb;
	--asi-shadow: 0 20px 60px rgba(0, 0, 0, .3);
	--asi-backdrop: rgba(15, 23, 32, .55);
	--asi-weight-strong: 600;
	--asi-gap: 1rem;
	--asi-focus: 0 0 0 3px rgba(11, 92, 173, .35);
}

/* ---------- Utility ---------------------------------------------------- */
.asi-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.asi-required { color: var(--asi-error); }
.asi-help { color: var(--asi-muted); font-size: .9em; }

/* ---------- Pulsanti --------------------------------------------------- */
.asi-btn {
	display: inline-flex; align-items: center; gap: .4em;
	padding: .6em 1.2em; border: 1px solid transparent; border-radius: var(--asi-radius);
	font: inherit; font-weight: var(--asi-weight-strong); line-height: 1.2; cursor: pointer; text-decoration: none;
	transition: background-color .15s, border-color .15s;
}
.asi-btn:focus-visible { outline: none; box-shadow: var(--asi-focus); }
.asi-btn--primary { background: var(--asi-primary); color: var(--asi-on-primary); }
.asi-btn--primary:hover { background: var(--asi-primary-dark); color: var(--asi-on-primary); }
.asi-btn--secondary { background: var(--asi-surface); color: var(--asi-primary); border-color: var(--asi-primary); }
.asi-btn--link { background: none; color: var(--asi-primary); padding: 0; text-decoration: underline; }
.asi-btn--danger { color: var(--asi-error); }
.asi-btn[disabled] { opacity: .6; cursor: not-allowed; }

/* ---------- Form ------------------------------------------------------- */
.asi-form { display: grid; gap: calc(var(--asi-gap) * 1.25); max-width: 960px; }
.asi-fieldset { border: 1px solid var(--asi-border); border-radius: var(--asi-radius); padding: var(--asi-gap); margin: 0; }
.asi-fieldset legend { font-weight: var(--asi-weight-strong); padding: 0 .4em; }
.asi-grid { display: grid; gap: var(--asi-gap); grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.asi-grid--address { grid-template-columns: 2fr 1fr 1fr 2fr; }
@media (max-width: 720px) { .asi-grid--address { grid-template-columns: 1fr 1fr; } }
.asi-field { display: grid; gap: .3em; }
.asi-field label { font-weight: var(--asi-weight-strong); }
.asi-field input:not([type=checkbox]):not([type=radio]),
.asi-field select,
.asi-field textarea {
	width: 100%; padding: .55em .7em; border: 1px solid var(--asi-border); border-radius: var(--asi-radius-sm);
	font: inherit; background: var(--asi-surface); color: var(--asi-text); box-sizing: border-box;
}
.asi-field :is(input, select, textarea):focus { outline: none; border-color: var(--asi-primary); box-shadow: var(--asi-focus); }
.asi-field.has-error :is(input, select, textarea) { border-color: var(--asi-error); }
.asi-field__error { color: var(--asi-error); font-size: .9em; margin: 0; }
.asi-checkboxes { border: 0; padding: 0; margin: 0 0 var(--asi-gap); }
.asi-checkboxes legend { font-weight: var(--asi-weight-strong); margin-bottom: .4em; }
.asi-checkboxes__list { display: flex; flex-wrap: wrap; gap: .4em .9em; }
.asi-checkboxes__list label { display: inline-flex; gap: .35em; align-items: center; font-weight: 400; }
.asi-register__tipo label { display: block; margin: .3em 0; }
.asi-upload-slots { list-style: none; padding: 0; display: grid; gap: var(--asi-gap); grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }
.asi-upload-slot { display: grid; gap: .4em; padding: .6em; border: 1px dashed var(--asi-border); border-radius: var(--asi-radius); }
.asi-upload-slot img { width: 100%; height: auto; border-radius: var(--asi-radius-sm); }
.asi-upload-slot__label { font-weight: var(--asi-weight-strong); font-size: .9em; }

/* ---------- Notifiche -------------------------------------------------- */
.asi-notice { padding: .8em 1em; border-radius: var(--asi-radius); background: var(--asi-bg-soft); border-left: 4px solid var(--asi-primary); }
.asi-notice--error { border-left-color: var(--asi-error); background: var(--asi-error-bg); }
.asi-notice--error:focus { outline: none; box-shadow: var(--asi-focus); }
.asi-notice--success { border-left-color: var(--asi-success); background: var(--asi-success-bg); }
.asi-status { padding: .6em .9em; border-radius: var(--asi-radius); }
.asi-status--ok { background: var(--asi-success-bg); }
.asi-status--pending { background: var(--asi-warning-bg); }
.asi-badge { display: inline-block; min-width: 1.5em; padding: .1em .45em; border-radius: var(--asi-radius-pill); background: var(--asi-primary); color: var(--asi-on-primary); font-size: .8em; text-align: center; }
.asi-badge--libero { background: var(--asi-libero); }
.asi-badge--occupato { background: var(--asi-occupato); }

/* ---------- Ricerca ---------------------------------------------------- */
.asi-search { display: grid; gap: var(--asi-gap); padding: var(--asi-gap); background: var(--asi-bg-soft); border-radius: var(--asi-radius); margin-bottom: calc(var(--asi-gap) * 1.5); }
.asi-search__main { display: grid; gap: var(--asi-gap); grid-template-columns: 2fr 1fr 1fr; align-items: end; }
@media (max-width: 720px) { .asi-search__main { grid-template-columns: 1fr; } }
.asi-search__filters summary { cursor: pointer; font-weight: var(--asi-weight-strong); }
.asi-search__grid { display: grid; gap: var(--asi-gap); grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); margin-top: var(--asi-gap); }
.asi-search__actions { display: flex; gap: var(--asi-gap); align-items: center; }
.asi-cards { list-style: none; padding: 0; display: grid; gap: var(--asi-gap); grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.asi-card { border: 1px solid var(--asi-border); border-radius: var(--asi-radius); overflow: hidden; background: var(--asi-surface); }
.asi-card__link { display: block; color: inherit; text-decoration: none; height: 100%; }
.asi-card__link:focus-visible { outline: none; box-shadow: var(--asi-focus); }
.asi-card__media img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; display: block; }
.asi-card__body { padding: .8em 1em 1em; }
.asi-card__title { margin: 0 0 .3em; font-size: 1.1em; }
.asi-card__meta, .asi-card__tags { margin: 0; color: var(--asi-muted); font-size: .9em; }
.asi-pagination { margin-top: var(--asi-gap); display: flex; gap: .4em; flex-wrap: wrap; }
.asi-pagination .page-numbers { padding: .3em .7em; border: 1px solid var(--asi-border); border-radius: var(--asi-radius-sm); text-decoration: none; }
.asi-pagination .current { background: var(--asi-primary); color: var(--asi-on-primary); border-color: var(--asi-primary); }

/* ---------- Galleria --------------------------------------------------- */
.asi-gallery { display: grid; gap: .6rem; margin-bottom: calc(var(--asi-gap) * 1.5); }
.asi-gallery__main { margin: 0; border-radius: var(--asi-radius); overflow: hidden; background: var(--asi-bg-soft); aspect-ratio: 3 / 2; }
.asi-gallery__main-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.asi-gallery__main.is-empty .asi-gallery__main-img { object-fit: contain; }
.asi-gallery__thumbs { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; grid-template-columns: repeat(4, 1fr); }
.asi-gallery__thumb-btn { display: block; width: 100%; padding: 0; border: 2px solid transparent; border-radius: var(--asi-radius-sm); overflow: hidden; background: var(--asi-bg-soft); cursor: pointer; aspect-ratio: 1; }
.asi-gallery__thumb-btn img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .2s; }
.asi-gallery__thumb-btn:hover img { transform: scale(1.05); }
.asi-gallery__thumb-btn:focus-visible { outline: none; border-color: var(--asi-primary); box-shadow: var(--asi-focus); }
/* Slot vuoto: placeholder visibile ma NON interattivo. */
.asi-gallery__thumb.is-empty,
.asi-gallery__thumb.is-empty .asi-gallery__thumb-btn { pointer-events: none; cursor: default; }
.asi-gallery__thumb.is-empty img { object-fit: contain; opacity: .7; transform: none; }

/* ---------- Scheda azienda --------------------------------------------- */
.asi-scheda__layout { display: grid; gap: calc(var(--asi-gap) * 2); grid-template-columns: 2fr 1fr; }
@media (max-width: 900px) { .asi-scheda__layout { grid-template-columns: 1fr; } }
.asi-scheda__ragione { color: var(--asi-muted); text-transform: uppercase; letter-spacing: .03em; }
.asi-scheda__dati { display: grid; grid-template-columns: max-content 1fr; gap: .5em 1.2em; }
.asi-scheda__dati dt { font-weight: var(--asi-weight-strong); }
.asi-scheda__dati dd { margin: 0; }
.asi-scheda__logo img { max-width: 220px; height: auto; }
.asi-tags { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: .35em; }
.asi-tags li { background: var(--asi-bg-soft); border: 1px solid var(--asi-border); border-radius: var(--asi-radius-pill); padding: .1em .7em; font-size: .9em; }
.asi-contact { display: grid; gap: .8em; padding: var(--asi-gap); border: 1px solid var(--asi-border); border-radius: var(--asi-radius); }
.asi-contact__list { display: grid; grid-template-columns: max-content 1fr; gap: .3em 1em; margin: 0; }
.asi-contact__list dt { font-weight: var(--asi-weight-strong); }
.asi-contact__list dd { margin: 0; overflow-wrap: anywhere; }

/* ---------- Mappe ------------------------------------------------------ */
.asi-map { width: 100%; min-height: 320px; border-radius: var(--asi-radius); background: var(--asi-bg-soft); margin-top: var(--asi-gap); }
.asi-lotti-map__canvas { min-height: 560px; }
.asi-map.is-error { display: flex; align-items: center; justify-content: center; min-height: 120px; }
.asi-map__error { color: var(--asi-error); padding: 1em; text-align: center; }
.asi-geo-picker__status { font-size: .9em; margin: .4em 0 0; color: var(--asi-muted); }
.asi-geo-picker__status[data-state=ok] { color: var(--asi-success); }
.asi-geo-picker__status[data-state=warning], .asi-geo-picker__status[data-state=manual] { color: var(--asi-warning); }
.asi-geo-picker__status[data-state=error] { color: var(--asi-error); }
.asi-lotti-map__legend { display: flex; flex-wrap: wrap; gap: .5em 1.5em; align-items: center; border: 1px solid var(--asi-border); border-radius: var(--asi-radius); padding: .6em 1em; }
.asi-lotti-map__legend label { display: inline-flex; align-items: center; gap: .4em; }
.asi-lotti-map__count { margin-left: auto; color: var(--asi-muted); }
.asi-swatch { width: 1em; height: 1em; border-radius: var(--asi-radius-sm); display: inline-block; border: 2px solid var(--asi-text); box-sizing: border-box; }
.asi-swatch--libero { background: var(--asi-libero); }
.asi-swatch--occupato { background: var(--asi-occupato); }
.asi-lotto-info h3 { margin: 0 0 .4em; font-size: 1rem; }
.asi-lotto-info dl { display: grid; grid-template-columns: max-content 1fr; gap: .2em .8em; margin: 0 0 .6em; }
.asi-lotto-info dd { margin: 0; }

/* ---------- Modali ----------------------------------------------------- */
.asi-modal { border: 0; border-radius: var(--asi-radius-lg); padding: 0; width: min(520px, calc(100vw - 2rem)); box-shadow: var(--asi-shadow); color: var(--asi-text); }
.asi-modal::backdrop { background: var(--asi-backdrop); }
.asi-modal__inner, .asi-modal form { padding: 1.5rem; display: grid; gap: .8rem; }
.asi-modal__header { display: flex; justify-content: space-between; align-items: start; gap: 1rem; }
.asi-modal__header h2 { margin: 0; font-size: 1.25rem; }
.asi-modal__close { background: none; border: 0; font-size: 1.8rem; line-height: 1; cursor: pointer; color: var(--asi-muted); }
.asi-modal__close:focus-visible { outline: none; box-shadow: var(--asi-focus); border-radius: var(--asi-radius-sm); }
.asi-modal #asi-login-form p { display: grid; gap: .3em; margin: 0 0 .6em; }
.asi-modal #asi-login-form input[type=text], .asi-modal #asi-login-form input[type=password] { padding: .55em .7em; border: 1px solid var(--asi-border); border-radius: var(--asi-radius-sm); font: inherit; }
.asi-modal #asi-login-form .login-remember { display: block; }
.asi-modal #asi-login-form .button-primary { background: var(--asi-primary); color: var(--asi-on-primary); border: 0; border-radius: var(--asi-radius); padding: .6em 1.2em; font-weight: var(--asi-weight-strong); cursor: pointer; }
.asi-modal__footer { font-size: .95em; display: flex; flex-wrap: wrap; gap: .5em; align-items: center; }
html.asi-modal-open { overflow: hidden; }
.asi-chat__thread { max-height: 240px; overflow-y: auto; display: grid; gap: .4em; }
.asi-chat__bubble { margin: 0; padding: .5em .8em; border-radius: var(--asi-radius-lg); background: var(--asi-bg-soft); white-space: pre-wrap; }
.asi-chat__bubble--me { background: var(--asi-chat-me-bg); justify-self: end; }
.asi-chat textarea { width: 100%; box-sizing: border-box; padding: .55em .7em; border: 1px solid var(--asi-border); border-radius: var(--asi-radius-sm); font: inherit; }

/* ---------- Tabella annunci -------------------------------------------- */
.asi-table { width: 100%; border-collapse: collapse; margin-bottom: 2rem; }
.asi-table caption { text-align: left; font-weight: var(--asi-weight-strong); padding-bottom: .5em; }
.asi-table th, .asi-table td { border-bottom: 1px solid var(--asi-border); padding: .5em; text-align: left; }
.asi-table__actions { display: flex; gap: 1em; align-items: center; }
.asi-inline-form { display: inline; margin: 0; }

/* ---------- Admin ------------------------------------------------------ */
.asi-admin-grid { display: grid; gap: 0 1rem; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.asi-admin-gallery__list { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0 0 8px; padding: 0; }
.asi-admin-gallery__list img { width: 80px; height: 80px; object-fit: cover; border-radius: var(--asi-radius-sm); display: block; }
.asi-admin-gallery__list li:first-child img { outline: 3px solid var(--asi-primary); }

/* ---------- Dati del Consorzio ---------------------------------------- */
.asi-consorzio { font-style: normal; display: grid; gap: .5em; }
.asi-consorzio__list { display: grid; grid-template-columns: max-content 1fr; gap: .3em 1em; margin: 0; }
.asi-consorzio__list dt { font-weight: var(--asi-weight-strong); }
.asi-consorzio__list dd { margin: 0; }
.asi-orari__table { border-collapse: collapse; width: 100%; }
.asi-orari__table th, .asi-orari__table td { text-align: left; padding: .3em .8em .3em 0; border-bottom: 1px solid var(--asi-border); }
.asi-orari__table .is-closed-day td { color: var(--asi-occupato); }
.asi-orari__note { font-size: .9em; margin: .6em 0 0; }
.asi-open-status { display: inline-flex; align-items: center; gap: .45em; font-size: .9em; margin-bottom: .5em; }
.asi-open-status::before { content: ""; width: .65em; height: .65em; border-radius: var(--asi-radius-pill); background: var(--asi-libero); border: 2px solid currentColor; }
.asi-open-status.is-closed::before { background: var(--asi-occupato); }

@media (prefers-reduced-motion: reduce) {
	.asi-gallery__thumb-btn img, .asi-btn { transition: none; }
}
