/* assets/css/businesses.css - business directory + profile (Dev 1). Only CSS variables from app.css, light/dark safe. */

/* ---------- directory grid ---------- */
.biz-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1rem; margin-bottom: 1.25rem; }
.biz-grid > .entity-card, .biz-grid > .biz-card-wrap > .entity-card { height: 100%; }
.biz-card-wrap { position: relative; display: flex; flex-direction: column; }
.biz-card-wrap > .entity-card { flex: 1; }
.biz-card-status { position: absolute; top: .5rem; left: .5rem; z-index: 3; }

/* ---------- profile hero ---------- */
.biz-hero { overflow: hidden; }
.biz-cover { height: 180px; background: linear-gradient(135deg, var(--c-primary), var(--c-accent)); position: relative; }
.biz-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.biz-head { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 1rem; padding: 0 1.25rem 1rem; margin-top: -48px; position: relative; }
.biz-logo-wrap { flex: 0 0 auto; }
.biz-logo { width: 96px; height: 96px; border-radius: 1rem; object-fit: cover; border: 4px solid var(--c-surface); background: var(--c-surface); display: block; box-shadow: 0 2px 10px rgba(0, 0, 0, .15); }
.biz-logo-ph { display: flex; align-items: center; justify-content: center; font-size: 2rem; font-weight: 700; color: #fff; background: var(--c-primary); }
.biz-head-main { flex: 1 1 260px; padding-top: 52px; }
.biz-h1 { font-size: 1.5rem; font-weight: 700; margin: 0 0 .15rem; overflow-wrap: anywhere; }
.biz-meta { display: flex; flex-wrap: wrap; gap: .35rem 1rem; color: var(--c-text-muted); font-size: .9rem; }
.biz-head-actions { flex: 0 0 auto; padding-top: 52px; }
.biz-contact-bar { display: flex; flex-wrap: wrap; gap: .5rem; padding: .85rem 1.25rem; border-top: 1px solid var(--c-border); background: var(--c-surface-2); }
.biz-description { line-height: 1.65; overflow-wrap: anywhere; }
.biz-rating-sum { display: flex; align-items: baseline; gap: .35rem; }
.biz-rating-num { font-size: 2rem; font-weight: 700; color: var(--c-accent); }

/* ---------- services / products ---------- */
.biz-items { list-style: none; margin: 0; padding: 0; }
.biz-items > li { display: flex; justify-content: space-between; gap: 1rem; padding: .7rem 0; border-bottom: 1px solid var(--c-border); }
.biz-items > li:last-child { border-bottom: 0; }
.biz-item-tools { display: inline-flex; gap: .15rem; }
.biz-products { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: .85rem; }
.biz-product { border: 1px solid var(--c-border); border-radius: .85rem; overflow: hidden; background: var(--c-surface); display: flex; flex-direction: column; }
.biz-product.is-out { opacity: .75; }
.biz-product-img { aspect-ratio: 4 / 3; background: var(--c-surface-2); display: flex; align-items: center; justify-content: center; color: var(--c-text-muted); font-size: 2rem; }
.biz-product-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.biz-product-body { padding: .65rem .75rem; display: flex; flex-direction: column; gap: .25rem; flex: 1; }
.biz-product-body h3 { font-size: .95rem; margin: 0; overflow-wrap: anywhere; }
.biz-product-body p { font-size: .8rem; color: var(--c-text-muted); margin: 0; }

/* ---------- photos ---------- */
.biz-photo { position: relative; margin: 0; }
.biz-photo img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 1; border-radius: .6rem; display: block; }
.biz-photo-del { position: absolute; top: .35rem; right: .35rem; width: 28px; height: 28px; border: 0; border-radius: 50%; background: rgba(0, 0, 0, .65); color: #fff; line-height: 1; cursor: pointer; }
.biz-photo-del:hover { background: var(--c-danger); }

/* ---------- reviews ---------- */
.biz-review { display: flex; gap: .75rem; padding: .85rem 0; border-top: 1px solid var(--c-border); }
.biz-review:first-child { border-top: 0; }
.biz-rate { display: inline-flex; flex-direction: row-reverse; justify-content: flex-end; gap: .15rem; }
.biz-rate input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.biz-rate label { font-size: 1.6rem; color: var(--c-border); cursor: pointer; line-height: 1; padding: .1rem; transition: color .12s, transform .12s; }
.biz-rate label:hover, .biz-rate label:hover ~ label, .biz-rate input:checked ~ label { color: var(--c-warning); }
.biz-rate input:focus-visible + label { outline: 2px solid var(--c-accent); border-radius: .25rem; }
.biz-rate label:active { transform: scale(.9); }

/* ---------- sidebar bits ---------- */
.biz-social { display: flex; flex-wrap: wrap; gap: .5rem; }
.biz-social a { width: 38px; height: 38px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--c-surface-2); color: var(--c-primary); border: 1px solid var(--c-border); text-decoration: none; }
.biz-social a:hover { background: var(--c-primary); color: #fff; }
.hours-list li.today { font-weight: 600; color: var(--c-accent); }

/* ---------- create / edit modal ---------- */
.biz-form-title { font-size: 1rem; font-weight: 600; margin: 1.25rem 0 .75rem; display: flex; align-items: center; gap: .5rem; color: var(--c-primary); }
.biz-hours-form { display: flex; flex-direction: column; gap: .4rem; margin-bottom: 1rem; }
.biz-hours-row { display: grid; grid-template-columns: 90px 1fr auto 1fr auto; align-items: center; gap: .4rem; }
.biz-hours-day { font-size: .85rem; font-weight: 600; }
.biz-hours-closed { display: inline-flex; align-items: center; gap: .3rem; margin: 0; white-space: nowrap; font-size: .8rem; }
.biz-hours-error:not(:empty) { display: block; }

@media (max-width: 575.98px) {
  .biz-cover { height: 130px; }
  .biz-head { flex-direction: column; align-items: center; text-align: center; margin-top: -44px; }
  .biz-head-main, .biz-head-actions { padding-top: 0; width: 100%; }
  .biz-head-main .d-flex, .biz-meta { justify-content: center; }
  .biz-head-actions .btn { width: 100%; }
  .biz-contact-bar .btn { flex: 1 1 calc(50% - .5rem); }
  .biz-hours-row { grid-template-columns: 1fr 1fr; }
  .biz-hours-row .biz-hours-day { grid-column: 1 / -1; }
  .biz-hours-row > span.text-muted { display: none; }
  .biz-hours-row .biz-hours-closed { grid-column: 1 / -1; }
}