/* ── iOS App Color Scheme ──
   background:      #0C1A2B
   cardBackground:  #1C2A3B
   accent:          #B6FF3B
   textPrimary:     #FFFFFF
   destructive:     rgba(255, 59, 48, 0.9)
*/

:root {
    --pp-bg: #0C1A2B;
    --pp-card: #1C2A3B;
    --pp-accent: #B6FF3B;
    --pp-accent-hover: #a3e635;
    --pp-text: #FFFFFF;
    --pp-text-muted: rgba(255, 255, 255, 0.55);
    --pp-border: rgba(255, 255, 255, 0.1);
    --pp-danger: rgba(255, 59, 48, 0.9);
}

/* ── Global ── */
body {
    background-color: var(--pp-bg) !important;
    color: var(--pp-text);
}

/* ── Sidebar ── */
.sidebar {
    width: 16rem;
    background-color: var(--pp-card) !important;
}
.sidebar-brand {
    color: var(--pp-accent) !important;
    font-weight: 700;
}
.sidebar-nav .nav-link {
    color: var(--pp-text-muted) !important;
}
.sidebar-nav .nav-link:hover,
.sidebar-nav .nav-link.active {
    color: var(--pp-text) !important;
    background-color: rgba(182, 255, 59, 0.1) !important;
}
.sidebar-nav .nav-link.active {
    border-left: 3px solid var(--pp-accent);
}

/* ── Wrapper / Main Area ── */
.wrapper {
    padding-left: 16rem;
    background-color: var(--pp-bg) !important;
}

/* ── Header ── */
.header {
    background-color: var(--pp-card) !important;
    border-bottom: 1px solid var(--pp-border);
    color: var(--pp-text) !important;
}
.header strong {
    color: var(--pp-text);
}

/* ── Cards ── */
.card {
    background-color: var(--pp-card) !important;
    border: 1px solid var(--pp-border) !important;
    color: var(--pp-text);
}
.card-footer {
    background-color: rgba(12, 26, 43, 0.5) !important;
    border-top: 1px solid var(--pp-border) !important;
    color: var(--pp-text-muted);
}

/* ── Tables ── */
.table {
    color: var(--pp-text) !important;
    --cui-table-bg: transparent;
    --cui-table-hover-bg: rgba(182, 255, 59, 0.06);
    --cui-table-striped-bg: transparent;
}
.table td {
    max-width: 320px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border-color: var(--pp-border) !important;
}
.table th {
    border-color: var(--pp-border) !important;
    color: var(--pp-text-muted);
}
.table th a {
    color: var(--pp-text-muted);
    text-decoration: none;
}
.table th a:hover {
    color: var(--pp-accent);
}
.table-hover tbody tr:hover {
    color: var(--pp-text);
}

/* ── Forms ── */
.form-control,
.form-select {
    background-color: var(--pp-bg) !important;
    border-color: var(--pp-border) !important;
    color: var(--pp-text) !important;
}
.form-control:focus,
.form-select:focus {
    border-color: var(--pp-accent) !important;
    box-shadow: 0 0 0 0.2rem rgba(182, 255, 59, 0.25) !important;
}
.form-control::placeholder {
    color: var(--pp-text-muted) !important;
}
.form-control[readonly] {
    background-color: rgba(28, 42, 59, 0.6) !important;
    opacity: 0.8;
}
.form-label {
    color: var(--pp-text-muted);
}
.form-text {
    color: var(--pp-text-muted) !important;
}
.form-select option {
    background-color: var(--pp-card);
    color: var(--pp-text);
}

/* ── Buttons ── */
.btn-primary {
    background-color: var(--pp-accent) !important;
    border-color: var(--pp-accent) !important;
    color: #0C1A2B !important;
    font-weight: 600;
}
.btn-primary:hover {
    background-color: var(--pp-accent-hover) !important;
    border-color: var(--pp-accent-hover) !important;
    color: #0C1A2B !important;
}
.btn-success {
    background-color: var(--pp-accent) !important;
    border-color: var(--pp-accent) !important;
    color: #0C1A2B !important;
    font-weight: 600;
}
.btn-success:hover {
    background-color: var(--pp-accent-hover) !important;
    border-color: var(--pp-accent-hover) !important;
    color: #0C1A2B !important;
}
.btn-danger {
    background-color: var(--pp-danger) !important;
    border-color: var(--pp-danger) !important;
    color: var(--pp-text) !important;
}
.btn-outline-secondary {
    border-color: var(--pp-border) !important;
    color: var(--pp-text-muted) !important;
}
.btn-outline-secondary:hover {
    background-color: rgba(255, 255, 255, 0.08) !important;
    color: var(--pp-text) !important;
    border-color: var(--pp-text-muted) !important;
}

/* ── Pagination ── */
.page-link {
    background-color: var(--pp-card) !important;
    border-color: var(--pp-border) !important;
    color: var(--pp-text) !important;
}
.page-link:hover {
    background-color: rgba(182, 255, 59, 0.1) !important;
    color: var(--pp-accent) !important;
}
.page-item.disabled .page-link {
    background-color: rgba(28, 42, 59, 0.5) !important;
    color: var(--pp-text-muted) !important;
}
.page-item.active .page-link {
    background-color: var(--pp-accent) !important;
    border-color: var(--pp-accent) !important;
    color: #0C1A2B !important;
}

/* ── Alerts ── */
.alert-success {
    background-color: rgba(182, 255, 59, 0.15) !important;
    border-color: rgba(182, 255, 59, 0.3) !important;
    color: var(--pp-accent) !important;
}
.alert-danger {
    background-color: rgba(255, 59, 48, 0.15) !important;
    border-color: rgba(255, 59, 48, 0.3) !important;
    color: #ff6b6b !important;
}
.alert-info {
    background-color: rgba(182, 255, 59, 0.08) !important;
    border-color: rgba(182, 255, 59, 0.2) !important;
    color: var(--pp-text-muted) !important;
}

/* ── Badges ── */
.badge.bg-secondary {
    background-color: rgba(255, 255, 255, 0.12) !important;
    color: var(--pp-text-muted) !important;
}

/* ── Clickable rows ── */
.clickable { cursor: pointer; }

/* ── Login page ── */
.login-page {
    background-color: var(--pp-bg);
    min-height: 100vh;
    display: flex;
    align-items: center;
}
.login-card {
    background-color: var(--pp-card) !important;
    border: 1px solid var(--pp-border) !important;
    border-radius: 18px;
}
.login-card h1 {
    color: var(--pp-accent);
}
.login-card .text-medium-emphasis {
    color: var(--pp-text-muted) !important;
}

/* ── Scrollbar (Webkit) ── */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
::-webkit-scrollbar-track {
    background: var(--pp-bg);
}
::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.15);
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.25);
}

/* ── Links ── */
a {
    color: var(--pp-accent);
}
a:hover {
    color: var(--pp-accent-hover);
}
.table>:not(caption)>*>*{
    color:white;
}