/*
 * WallCity visual system
 * Safe shared primitives only. Layout rules live in route-family stylesheets.
 */

.wc-theme {
    --theme-ink: #17353e;
    --theme-ink-2: #31515a;
    --theme-muted: #6b7d82;
    --theme-bg: #f3f5f2;
    --theme-surface: #ffffff;
    --theme-surface-soft: #f8f9f6;
    --theme-line: #d8dfdc;
    --theme-line-strong: #bdcac6;
    --theme-accent: #00aeef;
    --theme-accent-dark: #008bc2;
    --theme-mint: #2f8e82;
    --theme-mint-soft: #e1f0ec;
    --theme-sand: #c8f0ff;
    --theme-danger: #b94343;
    --theme-success: #287d57;
    --theme-radius-sm: 8px;
    --theme-radius: 14px;
    --theme-radius-lg: 20px;
    --theme-shadow-sm: 0 3px 10px rgba(23, 53, 62, .055);
    --theme-shadow: 0 12px 32px rgba(23, 53, 62, .09);
    --theme-shadow-lg: 0 24px 64px rgba(23, 53, 62, .13);
    --wc-primary: #17353e;
    --wc-primary-d: #0d252c;
    --wc-primary-l: #2f8e82;
    --wc-bg: #f3f5f2;
    --wc-card-bg: #ffffff;
    --wc-text: #17353e;
    --wc-text-2: #31515a;
    --wc-muted: #6b7d82;
    --wc-muted-2: #839297;
    --wc-border: #d8dfdc;
    --bs-primary: #17353e;
    --bs-primary-rgb: 23, 53, 62;
    --bs-body-color: #17353e;
    --bs-body-bg: #f3f5f2;
    min-height: 100vh;
    color: var(--theme-ink);
    background: var(--theme-bg);
    font-family: "Rubik", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

.wc-theme *,
.wc-theme *::before,
.wc-theme *::after {
    box-sizing: border-box;
}

.wc-theme ::selection {
    color: #fff;
    background: var(--theme-accent);
}

.wc-theme :focus-visible {
    outline: 3px solid rgba(0, 174, 239, .32);
    outline-offset: 2px;
}

.wc-theme h1,
.wc-theme h2,
.wc-theme h3,
.wc-theme h4,
.wc-theme h5,
.wc-theme h6 {
    color: var(--theme-ink);
    font-weight: 800;
    letter-spacing: -.025em;
}

.wc-theme a {
    color: var(--theme-ink-2);
    text-underline-offset: 3px;
}

.wc-theme a:hover {
    color: var(--theme-accent-dark);
}

.wc-theme .text-muted,
.wc-theme .text-muted-2 {
    color: var(--theme-muted) !important;
}

.wc-theme .btn {
    min-height: 42px;
    border-radius: var(--theme-radius-sm);
    padding: .56rem 1rem;
    border-width: 1px;
    font-weight: 700;
    box-shadow: none;
    transition: transform .15s ease, box-shadow .15s ease, color .15s ease, background-color .15s ease, border-color .15s ease;
}

.wc-theme .btn:hover {
    transform: translateY(-1px);
}

.wc-theme .btn:active {
    transform: none;
}

.wc-theme .btn-primary,
.wc-theme .bg-primary {
    color: #fff;
    border-color: var(--theme-ink);
    background-color: var(--theme-ink) !important;
}

.wc-theme .btn-primary:hover,
.wc-theme .btn-primary:focus {
    color: #fff;
    border-color: #0d252c;
    background-color: #0d252c !important;
    box-shadow: 0 8px 20px rgba(23, 53, 62, .17);
}

.wc-theme .btn-warning {
    color: var(--theme-ink);
    border-color: var(--theme-sand);
    background-color: var(--theme-sand);
}

.wc-theme .btn-success {
    border-color: var(--theme-success);
    background-color: var(--theme-success);
}

.wc-theme .btn-outline-primary {
    color: var(--theme-ink);
    border-color: var(--theme-line-strong);
    background: var(--theme-surface);
}

.wc-theme .btn-outline-primary:hover,
.wc-theme .btn-outline-primary:focus {
    color: #fff;
    border-color: var(--theme-ink);
    background: var(--theme-ink);
}

.wc-theme .btn-outline-secondary {
    color: var(--theme-ink-2);
    border-color: var(--theme-line-strong);
    background: var(--theme-surface);
}

.wc-theme .form-label {
    margin-bottom: .42rem;
    color: var(--theme-ink-2);
    font-size: .84rem;
    font-weight: 700;
}

.wc-theme .form-control,
.wc-theme .form-select,
.wc-theme .input-group-text {
    min-height: 44px;
    border: 1px solid var(--theme-line-strong);
    border-radius: var(--theme-radius-sm);
    color: var(--theme-ink);
    background-color: var(--theme-surface);
    box-shadow: none;
}

.wc-theme .form-control-lg,
.wc-theme .form-select-lg {
    min-height: 50px;
    border-radius: 10px;
    font-size: 1rem;
}

.wc-theme .form-control:focus,
.wc-theme .form-select:focus {
    border-color: var(--theme-mint);
    background-color: #fff;
    box-shadow: 0 0 0 4px rgba(47, 142, 130, .12);
}

.wc-theme .form-control::placeholder {
    color: #95a1a4;
}

.wc-theme .form-check-input {
    border-color: var(--theme-line-strong);
    background-color: var(--theme-surface);
}

.wc-theme .form-check-input:checked {
    border-color: var(--theme-ink);
    background-color: var(--theme-ink);
}

.wc-theme .form-text {
    color: var(--theme-muted);
    line-height: 1.5;
}

.wc-theme .card {
    border: 1px solid var(--theme-line);
    border-radius: var(--theme-radius);
    background: var(--theme-surface);
    box-shadow: var(--theme-shadow-sm);
}

.wc-theme .alert {
    border: 1px solid currentColor;
    border-radius: 10px;
    box-shadow: none;
}

.wc-theme .badge {
    border-radius: 6px;
    font-weight: 700;
}

.wc-theme .dropdown-menu {
    padding: .5rem;
    border: 1px solid var(--theme-line);
    border-radius: 12px;
    background: var(--theme-surface);
    box-shadow: var(--theme-shadow);
}

.wc-theme .dropdown-item {
    min-height: 40px;
    display: flex;
    align-items: center;
    gap: .55rem;
    border-radius: 8px;
    color: var(--theme-ink-2);
    font-weight: 600;
}

.wc-theme .dropdown-item:hover,
.wc-theme .dropdown-item:focus,
.wc-theme .dropdown-item.active {
    color: var(--theme-ink);
    background: var(--theme-mint-soft);
}

.wc-theme .modal-content {
    border: 1px solid var(--theme-line);
    border-radius: var(--theme-radius-lg);
    background: var(--theme-surface);
    box-shadow: var(--theme-shadow-lg);
}

.wc-theme .modal-header,
.wc-theme .modal-footer {
    border-color: var(--theme-line);
}

.wc-theme .nav-pills {
    gap: 5px;
    padding: 5px;
    border: 1px solid var(--theme-line);
    border-radius: 10px;
    background: var(--theme-surface-soft);
}

.wc-theme .nav-pills .nav-link {
    border-radius: 7px;
    color: var(--theme-ink-2);
    font-size: .84rem;
    font-weight: 700;
}

.wc-theme .nav-pills .nav-link.active {
    color: #fff;
    background: var(--theme-ink);
}

.wc-theme .pagination {
    gap: 6px;
    justify-content: center;
    margin-top: 2rem;
}

.wc-theme .page-link {
    min-width: 40px;
    min-height: 40px;
    display: grid;
    place-items: center;
    border: 1px solid var(--theme-line);
    border-radius: 8px !important;
    color: var(--theme-ink);
    background: var(--theme-surface);
}

.wc-theme .page-item.active .page-link {
    border-color: var(--theme-ink);
    background: var(--theme-ink);
}

.wc-theme .table {
    --bs-table-bg: transparent;
    --bs-table-striped-bg: rgba(47, 142, 130, .035);
    color: var(--theme-ink-2);
}

.wc-theme .table thead th {
    border-bottom-color: var(--theme-line-strong);
    color: var(--theme-ink);
    background: #eef1ee;
    font-size: .76rem;
    font-weight: 800;
}

.wc-theme .table tbody td {
    border-color: var(--theme-line);
}

.wc-theme .breadcrumb {
    font-size: .82rem;
}

.wc-theme .breadcrumb-item,
.wc-theme .breadcrumb-item a {
    color: var(--theme-muted);
    text-decoration: none;
}

.wc-theme .breadcrumb-item.active {
    color: var(--theme-ink);
    font-weight: 700;
}

@media (max-width: 767.98px) {
    .wc-theme .btn {
        min-height: 44px;
    }

    .wc-theme .container {
        --bs-gutter-x: 1.2rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .wc-theme *,
    .wc-theme *::before,
    .wc-theme *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}