:root {
    --font-family-base: 'Poppins', Arial, sans-serif;
    --color-text: #202531;
    --color-muted: #64748b;
    --color-border: rgba(148, 163, 184, 0.35);
    --color-border-strong: rgba(15, 23, 42, 0.12);
    --color-primary: #6366f1;
    --color-primary-dark: #4338ca;
    --color-success: #16a34a;
    --color-danger: #ef4444;
    --color-surface: #ffffff;
    --color-surface-alt: #f1f5f9;
    --shadow-card: 0 14px 48px rgba(15, 23, 42, 0.08);
    --shadow-card-small: 0 8px 24px rgba(15, 23, 42, 0.06);

    --space-0: 0;
    --space-xxs: 4px;
    --space-xs: 6px;
    --space-sm: 8px;
    --space-md: 12px;
    --space-lg: 16px;
    --space-xl: 24px;
    --space-2xl: 28px;
    --space-3xl: 32px;

    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 14px;
    --radius-pill: 999px;
}

* { box-sizing: border-box; }

body {
    margin: 0;
    font-family: var(--font-family-base);
    color: var(--color-text);
    background: #ffffff;
    line-height: 1.5;
}

a { color: var(--color-primary); text-decoration: none; }
a:hover, a:focus-visible { color: var(--color-primary-dark); text-decoration: underline; outline: none; }

img { max-width: 100%; height: auto; }

[hidden] { display: none !important; }

/* Utilities used by gallery pages */
.u-maxw-sm { max-width: 480px; }
.u-maxw-md { max-width: 680px; }
.u-maxw-lg { max-width: 920px; }
.u-mt-2xl { margin-top: var(--space-2xl) !important; }
.u-mt-md { margin-top: var(--space-md) !important; }
.u-mt-sm { margin-top: var(--space-sm) !important; }
.u-mb-lg { margin-bottom: var(--space-lg) !important; }
.u-mb-md { margin-bottom: var(--space-md) !important; }
.u-mt-md { margin-top: var(--space-md) !important; }
.u-text-center { text-align: center; }
.u-text-lg { font-size: 1.15rem; }
.u-text-base { font-size: 1rem; }
.u-text-sm { font-size: 0.85rem; }
.u-text-muted { color: var(--color-muted); }
.u-grid { display: grid; gap: var(--space-lg); }
.u-gap-md { gap: var(--space-md); }
.u-py-lg { padding-top: var(--space-lg); padding-bottom: var(--space-lg); }
.u-px-lg { padding-left: var(--space-lg); padding-right: var(--space-lg); }
.u-mt-md { margin-top: var(--space-md); }
.u-mt-xl { margin-top: var(--space-xl); }
.u-mb-md { margin-bottom: var(--space-md); }

/* Form controls */
.c-input, .c-select, .c-textarea {
    width: 100%;
    font: inherit;
    color: inherit;
    padding: 10px 12px;
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border);
    background: #ffffff;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.c-textarea { resize: vertical; min-height: 120px; }
.c-select { appearance: none; }
.c-input:focus, .c-select:focus, .c-textarea:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(99,102,241,0.18); }

.c-label { display:flex; flex-direction:column; font-size:0.85rem; font-weight:600; gap:var(--space-xs); color:var(--color-text); }

/* Buttons */
.c-btn {
    display:inline-flex; align-items:center; justify-content:center; gap:var(--space-xs);
    padding:10px 18px; border-radius:var(--radius-md); border:1px solid transparent; font-weight:600; font-size:0.95rem; cursor:pointer;
}
.c-btn:disabled { opacity:0.55; cursor:not-allowed; }
.c-btn--primary { color:#fff; background: linear-gradient(120deg,var(--color-primary),#22d3ee); box-shadow: 0 8px 20px rgba(99,102,241,0.34); }
.c-btn--primary:hover, .c-btn--primary:focus-visible { background: linear-gradient(120deg,#4f46e5,#0ea5e9); }
.c-btn--outline { color:var(--color-primary); border-color: rgba(79,70,229,0.35); background:#fff; }
.c-btn--outline:hover, .c-btn--outline:focus-visible { border-color: rgba(79,70,229,0.6); color:#312e81; }
.c-btn--outline-danger { color: var(--color-danger); border-color: rgba(239,68,68,0.35); background:#fff; }
.c-btn--outline-danger:hover, .c-btn--outline-danger:focus-visible { border-color: rgba(239,68,68,0.6); color:#b91c1c; }
.c-btn--ghost { color: var(--color-muted); background: transparent; border-color: transparent; }
.c-btn--ghost:hover, .c-btn--ghost:focus-visible { color: var(--color-text); background: rgba(15,23,42,0.06); }

/* Card */
.c-card { background: var(--color-surface); border-radius:12px; box-shadow:var(--shadow-card); padding:14px 16px; margin: var(--space-2xl) auto; }
.c-card--tight { padding:22px; margin:var(--space-xl) auto; box-shadow:var(--shadow-card-small); }

/* Sowy subsystem pieces used by gallery */
.sowy-gallery { display:grid; grid-template-columns: repeat(auto-fit, minmax(200px,1fr)); gap:18px; margin-top:18px; }
.sowy-gallery__item {
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-start;
    gap:var(--space-xs);
    width:100%;
    padding:0;
    border:none;
    background:transparent;
    text-decoration:none;
    color:inherit;
    text-align:center;
    cursor:zoom-in;
    appearance:none;
}
.sowy-gallery__item:hover .sowy-gallery__image { transform: scale(1.02); box-shadow:0 12px 30px rgba(15,23,42,0.16); }
.sowy-gallery__item:focus-visible { outline:3px solid var(--color-primary); outline-offset:4px; }
.sowy-gallery__image { width:100%; max-width:320px; height:220px; object-fit:cover; border-radius:12px; border:1px solid rgba(0,0,0,0.06); margin:0 auto; display:block; }
.sowy-gallery__image { transition: transform 0.18s ease, box-shadow 0.18s ease; }
.sowy-gallery__label { margin-top: var(--space-sm); font-weight:700; display:block; }

.sowy-actions-panel__summary { display:grid; gap:6px; font-size:0.9rem; color:#475569; padding:10px 12px; border-radius:10px; background:#f8fafc; border:1px solid rgba(148,163,184,0.35); }
.sowy-actions-panel__summary strong { color:#0f172a; }
.sowy-actions-panel__form { display:grid; gap:10px; padding:14px; border-radius:12px; border:1px solid rgba(79,70,229,0.12); background: linear-gradient(180deg,#ffffff 0%,#f8fbff 100%); }
.sowy-actions-panel__form textarea, .sowy-actions-panel__form select, .sowy-actions-panel__form input[type="text"], .sowy-actions-panel__form input[type="number"] { width:100%; padding:10px 12px; border-radius:10px; border:1px solid rgba(148,163,184,0.35); font-family:inherit; font-size:0.95rem; }
.sowy-actions-panel__form textarea { min-height:80px; }
.sowy-actions-panel__actions { display:flex; flex-wrap:wrap; gap:8px; }

.sowy-note { margin-top: var(--space-sm); padding:10px 12px; border-left:3px solid rgba(148,163,184,0.7); background: rgba(226,232,240,0.45); font-size:0.9rem; color:#334155; }
.sowy-note--warning { border-left-color: var(--color-danger); background: rgba(239,68,68,0.12); color:#991b1b; }

/* small helper classes specific to gallery */
.g-excerpt { margin-top:6px; }
.g-label-bottom { margin-bottom:6px; display:block; }
.g-input-inline { display:inline-block; width:70%; margin-right:8px; vertical-align:middle; }
.g-actions-top { margin-top:8px; }
.g-summary-top { margin-top:0.25rem; }
.gal-md-list { margin:.3rem 0 0 1.1rem; padding:0; font-size: smaller;}
.list-item-form { margin-bottom:.5rem; }
.inline-form { display:inline; }
.btn-danger { background:#c62828; color:#fff; border:none; padding:.6rem 1rem; border-radius:4px; display:inline-block; }
.link-ghost-margin { margin-left:8px; }
.trash-manage-btn { margin-left:1rem; vertical-align:middle; }
.form-border-bottom { border-bottom:1px solid #eee; padding-bottom:1rem; }
.panel { max-width:760px; margin:2em auto; }
.gal-login-panel { max-width:560px; margin:3.5em auto; }

/* Trash table helpers */
.btn { padding:.4rem .6rem; border-radius:4px; border:none; color:#fff; }
.btn-restore { background:#2e7d32; }
.btn-del { background:#c62828; }
.btn-empty { background:#555; }
.msg-success { color:green; }
.msg-error { color:red; }

/* Gallery-specific styles consolidated from inline styles */
/* Applied only to pages inside /galeria */
body { background:#f8f9fa; margin:0; padding:1rem; font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; }
.md { background:#fff; padding:1rem; border-radius:8px; box-shadow:0 1px 6px rgba(0,0,0,0.06); margin:1rem 0; }
.gal-panel { max-width:760px; margin:2em auto; }
.gal-login-panel { max-width:560px; margin:3.5em auto; }
img { max-width:200px; display:block; margin-bottom:.5rem; }
.g-excerpt { margin-top:6px; }
.g-label-bottom { margin-bottom:6px; display:block; }
.g-input-inline { display:inline-block; width:70%; margin-right:8px; vertical-align:middle; }
.g-actions-top { margin-top:8px; }
.g-summary-top { margin-top:0.25rem; }
.gal-md-list { margin:.3rem 0 0 1.1rem; padding:0; }
.list-item-form { margin-bottom:.5rem; }
.btn-danger { background:#c62828; color:#fff; border:none; padding:.6rem 1rem; border-radius:4px; display:inline-block; }
.link-ghost-margin { margin-left:8px; }
.trash-manage-btn { margin-left:1rem; vertical-align:middle; }
.form-border-bottom { border-bottom:1px solid #eee; padding-bottom:1rem; }
.inline-form { display:inline; }
/* Trash table */
table.gal-trash { border-collapse:collapse; width:100%; }
table.gal-trash th, table.gal-trash td { border:1px solid #eee; padding:.5rem; text-align:left; }
.btn { padding:.4rem .6rem; border-radius:4px; border:none; color:#fff; }
.btn-restore { background:#2e7d32; }
.btn-del { background:#c62828; }
.btn-empty { background:#555; }
.msg-success { color:green; }
.msg-error { color:red; }

/* Lightbox overlay for gallery */
body.g-lightbox-open { overflow: hidden; }

.g-lightbox {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 3vw;
    background: rgba(15, 23, 42, 0.88);
    z-index: 4000;
}

.g-lightbox__content {
    position: relative;
    z-index: 2;
    max-width: 90vw;
    text-align: center;
}

.g-lightbox__image {
    max-width: min(90vw, 1200px);
    max-height: 80vh;
    border-radius: 12px;
    box-shadow: 0 24px 48px rgba(15, 23, 42, 0.5);
    display: block;
    margin: 0 auto;
    background: #0f172a;
}

.g-lightbox__caption {
    margin-top: 1rem;
    color: #e2e8f0;
    font-size: 1rem;
    white-space: pre-line;
}

.g-lightbox__close {
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
    border: none;
    background: rgba(15, 23, 42, 0.6);
    color: #ffffff;
    font-size: 2.5rem;
    line-height: 1;
    padding: 0 0.6rem;
    cursor: pointer;
    border-radius: 10px;
    z-index: 3;
}

.g-lightbox__close:hover,
.g-lightbox__close:focus-visible {
    background: rgba(15, 23, 42, 0.85);
}

.g-lightbox__nav {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 22%;
    border: none;
    background: transparent;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(226, 232, 240, 0.75);
    font-size: 3rem;
    z-index: 2;
    transition: color 0.15s ease, background 0.15s ease;
}

.g-lightbox__nav:hover,
.g-lightbox__nav:focus-visible {
    background: rgba(15, 23, 42, 0.25);
    color: #ffffff;
}

.g-lightbox__nav:focus,
.g-lightbox__close:focus {
    outline: none;
}

.g-lightbox__close:hover,
.g-lightbox__close:focus-visible {
    background: rgba(15, 23, 42, 0.85);
}

.g-lightbox__nav--prev { left: 0; }
.g-lightbox__nav--next { right: 0; }
.g-lightbox__nav span { pointer-events: none; }

@media (max-width: 640px) {
    .g-lightbox__nav { width: 30%; font-size: 2.4rem; }
    .g-lightbox__close { font-size: 2rem; top: 1rem; right: 1rem; }
}
