/* ============================================================
   AL-FIRDAUS — additions for the Laravel site
   (site.css and brand.css are the approved design, unchanged)
   ============================================================ */

/* Photos: the old design tool's <image-slot> is now a plain frame. */
image-slot { display: block; overflow: hidden; border-radius: var(--r, 16px); background: var(--af-soft-bg); }
image-slot img { width: 100%; height: 100%; object-fit: cover; display: block; }
.about-media image-slot.img-main { height: 420px; }
.about-media image-slot.img-sub { height: 220px; }
.galeri-grid image-slot { min-height: 180px; }

/* Category filters are links now (server-rendered), styled as the buttons were. */
.berita-tapis a { border: 1.5px solid var(--af-line); background: #fff; border-radius: 99px; padding: 8px 16px; font-family: var(--font-head); font-weight: 600; font-size: 13.5px; color: var(--af-ink-soft); text-decoration: none; }
.berita-tapis a.on { background: var(--af-grad); color: #fff; border-color: transparent; }

/* Log keluar inside the login dropdown and the slim header is a form. */
.login-drop form { margin: 0; }
.login-drop form .ld-keluar { width: 100%; }
.header-cta form { margin: 0; display: inline; }

/* Server-side form errors on the customer auth pages. */
.ak-auth .field .err { color: var(--af-alert); font-size: 12.5px; margin-top: 4px; }
.ak-auth .ak-consent { display: flex; gap: 10px; align-items: flex-start; font-size: 13.5px; color: var(--af-ink-soft); }
.ak-auth .ak-consent input { margin-top: 3px; }
.ak-auth .ak-links { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; font-size: 13.5px; }
.ak-auth .ak-links a { color: var(--af-primary-3); }
.ak-tabs a { text-align: center; padding: 10px; border-radius: 9px; font-family: var(--font-head); font-weight: 600; color: var(--af-ink-soft); text-decoration: none; }
.ak-tabs a.on { background: #fff; color: var(--af-ink); box-shadow: var(--shadow-sm); }
.ak-auth form { display: grid; gap: 14px; }
.ak-google { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; }