/* ═══════════════════════════════════════════
   Shinori Dashboard — CSS v2.0
   Dark theme, modern, mobile-first
   ═══════════════════════════════════════════ */

:root {
    --sh-bg:        #0a0e27;
    --sh-surface:   #111633;
    --sh-surface2:  #1a1f40;
    --sh-border:    #2a2f55;
    --sh-text:      #e4e6f0;
    --sh-text-dim:  #8890b5;
    --sh-primary:   #0f3460;
    --sh-accent:    #e94560;
    --sh-success:   #16c784;
    --sh-warning:   #f5a623;
    --sh-danger:    #ef4444;
    --sh-gold:      #d4af37;
    --sh-radius:    12px;
    --sh-shadow:    0 4px 24px rgba(0,0,0,0.4);
}

/* ─── Global ─── */
.shinori-wrap {
    max-width: 1400px;
    margin: 0 auto;
    padding: 20px;
    font-family: 'Segoe UI', -apple-system, sans-serif;
    color: var(--sh-text);
    background: var(--sh-bg);
}

.shinori-public-body {
    margin: 0;
    background: var(--sh-bg);
    color: var(--sh-text);
}

.shinori-public {
    max-width: 1200px;
    margin: 0 auto;
}

.shinori-title {
    font-size: 28px;
    font-weight: 700;
    margin: 0 0 4px;
    color: #fff;
}

.shinori-subtitle {
    color: var(--sh-text-dim);
    margin: 0 0 24px;
    font-size: 14px;
}

/* ─── KPI Cards ─── */
.shinori-kpi-row {
    display: flex;
    gap: 16px;
    margin-bottom: 24px;
    flex-wrap: wrap;
}

.shinori-kpi {
    flex: 1;
    min-width: 180px;
    background: var(--sh-surface);
    border-radius: var(--sh-radius);
    box-shadow: var(--sh-shadow);
    overflow: hidden;
    display: flex;
    border: 1px solid var(--sh-border);
}

.shinori-kpi-icon {
    width: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    flex-shrink: 0;
}

.shinori-kpi-body {
    padding: 16px 20px;
}

.shinori-kpi-val {
    font-size: 22px;
    font-weight: 700;
    color: #fff;
}

.shinori-kpi-label {
    font-size: 12px;
    color: var(--sh-text-dim);
    margin-top: 4px;
}

.shinori-kpi-change {
    font-size: 13px;
    margin-top: 4px;
    font-weight: 600;
}

.shinori-kpi-change.up   { color: var(--sh-success); }
.shinori-kpi-change.down { color: var(--sh-danger); }

/* ─── Cards ─── */
.shinori-card {
    background: var(--sh-surface);
    border-radius: var(--sh-radius);
    box-shadow: var(--sh-shadow);
    padding: 24px;
    margin-bottom: 24px;
    border: 1px solid var(--sh-border);
}

.shinori-card h2 {
    margin: 0 0 16px;
    font-size: 18px;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 8px;
}

.shinori-card-footer {
    margin-top: 16px;
    padding-top: 12px;
    border-top: 1px solid var(--sh-border);
    color: var(--sh-text-dim);
    font-size: 13px;
}

/* ─── Grid ─── */
.shinori-grid-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

@media (max-width: 900px) {
    .shinori-grid-2 { grid-template-columns: 1fr; }
}

/* ─── Tables ─── */
.shinori-table {
    width: 100%;
    border-collapse: collapse;
}

.shinori-table th,
.shinori-table td {
    padding: 10px 12px;
    border-bottom: 1px solid var(--sh-border);
    text-align: left;
    font-size: 13px;
}

.shinori-table th {
    color: var(--sh-text-dim);
    font-weight: 600;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.shinori-table td.right {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.shinori-table .shinori-bold {
    font-weight: 700;
    color: #fff;
}

.shinori-table .shinori-highlight {
    background: rgba(233, 69, 96, 0.08);
}

.shinori-empty {
    text-align: center;
    padding: 40px;
    color: var(--sh-text-dim);
}

/* ─── Widefat override ─── */
.shinori-wrap .widefat th,
.shinori-wrap .widefat td {
    background: var(--sh-surface);
    color: var(--sh-text);
    border-color: var(--sh-border);
}

.shinori-wrap .widefat thead th {
    background: var(--sh-surface2);
    color: var(--sh-text-dim);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: 0.5px;
}

.shinori-wrap .widefat tr:hover td {
    background: var(--sh-surface2);
}

/* ─── Badges ─── */
.shinori-badge {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.shinori-badge-active   { background: rgba(22,199,132,0.15); color: var(--sh-success); }
.shinori-badge-ok       { background: rgba(22,199,132,0.15); color: var(--sh-success); }
.shinori-badge-pipeline { background: rgba(245,166,35,0.15); color: var(--sh-warning); }
.shinori-badge-low      { background: rgba(245,166,35,0.15); color: var(--sh-warning); }
.shinori-badge-empty    { background: rgba(239,68,68,0.15);  color: var(--sh-danger); }
.shinori-badge-discontinued { background: rgba(100,100,100,0.2); color: #999; }
.shinori-badge-deleted  { background: rgba(100,100,100,0.2); color: #666; }
.shinori-badge-bull     { background: rgba(22,199,132,0.15); color: var(--sh-success); }
.shinori-badge-base     { background: rgba(15,52,96,0.3);    color: #88b4e7; }
.shinori-badge-bear     { background: rgba(233,69,96,0.15);  color: var(--sh-accent); }

/* ─── Bar Chart (inventory level) ─── */
.shinori-bar {
    width: 100%;
    height: 8px;
    background: var(--sh-surface2);
    border-radius: 4px;
    overflow: hidden;
}

.shinori-bar-fill {
    height: 100%;
    border-radius: 4px;
    transition: width 0.3s ease;
}

.shinori-bar-ok       { background: var(--sh-success); }
.shinori-bar-low      { background: var(--sh-warning); }
.shinori-bar-empty    { background: var(--sh-danger); }
.shinori-bar-overstock{ background: var(--sh-primary); }

/* ─── Alerts ─── */
.shinori-alerts-card .shinori-alert {
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 8px;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    flex-wrap: wrap;
    border: 1px solid var(--sh-border);
}

.shinori-alert-yellow { background: rgba(245,166,35,0.08); border-left: 3px solid var(--sh-warning); }
.shinori-alert-red    { background: rgba(239,68,68,0.08);  border-left: 3px solid var(--sh-danger); }

.shinori-alert strong { flex: 1; }
.shinori-alert p { width: 100%; margin: 4px 0 0; font-size: 13px; color: var(--sh-text-dim); }
.shinori-alert-time { font-size: 11px; color: var(--sh-text-dim); }

/* ─── Filter Bar ─── */
.shinori-filter-bar {
    margin-bottom: 16px;
    padding: 12px 16px;
    background: var(--sh-surface);
    border-radius: var(--sh-radius);
    border: 1px solid var(--sh-border);
}

.shinori-filter-bar select,
.shinori-filter-bar input[type="search"] {
    background: var(--sh-surface2);
    color: var(--sh-text);
    border: 1px solid var(--sh-border);
    border-radius: 6px;
    padding: 6px 10px;
}

/* ─── Forms ─── */
.shinori-form-card {
    border: 2px solid var(--sh-accent);
}

.shinori-form-table th {
    color: var(--sh-text-dim);
    width: 180px;
    padding: 8px 12px;
}

.shinori-form-table td {
    padding: 8px 12px;
}

.shinori-form-table input[type="text"],
.shinori-form-table input[type="number"],
.shinori-form-table input[type="date"],
.shinori-form-table select,
.shinori-form-table textarea {
    background: var(--sh-surface2);
    color: var(--sh-text);
    border: 1px solid var(--sh-border);
    border-radius: 6px;
    padding: 8px 12px;
    width: 100%;
    max-width: 400px;
}

.shinori-form-table input:focus,
.shinori-form-table select:focus,
.shinori-form-table textarea:focus {
    border-color: var(--sh-accent);
    outline: none;
    box-shadow: 0 0 0 2px rgba(233,69,96,0.2);
}

.shinori-input-table {
    width: auto;
}

.shinori-input-table td {
    padding: 8px 12px;
    background: transparent;
    border: none;
}

.shinori-total-display {
    font-size: 20px;
    font-weight: 700;
    color: var(--sh-success);
}

/* ─── Buttons override ─── */
.shinori-wrap .button,
.shinori-wrap .button-primary,
.shinori-wrap .button-secondary {
    background: var(--sh-surface2);
    color: var(--sh-text);
    border: 1px solid var(--sh-border);
    border-radius: 6px;
    padding: 6px 16px;
    cursor: pointer;
    text-decoration: none;
    font-size: 13px;
}

.shinori-wrap .button:hover,
.shinori-wrap .button-secondary:hover {
    background: var(--sh-border);
    color: #fff;
}

.shinori-wrap .button-primary {
    background: var(--sh-accent) !important;
    color: #fff !important;
    border-color: var(--sh-accent) !important;
}

.shinori-wrap .button-primary:hover {
    background: #d63a54 !important;
}

/* ─── Help Box ─── */
.shinori-help-box {
    margin-top: 24px;
    padding: 20px;
    background: var(--sh-surface2);
    border-radius: 8px;
    border: 1px solid var(--sh-border);
}

.shinori-help-box h3 {
    margin: 0 0 12px;
    font-size: 15px;
    color: #fff;
}

/* ─── Tabs ─── */
.shinori-tabs .nav-tab {
    background: var(--sh-surface);
    color: var(--sh-text-dim);
    border-color: var(--sh-border);
}

.shinori-tabs .nav-tab-active {
    background: var(--sh-surface2);
    color: #fff;
    border-bottom-color: var(--sh-surface2);
}

/* ─── Standalone Header ─── */
.shinori-header {
    text-align: center;
    padding: 32px 20px 20px;
}

.shinori-header h1 {
    font-size: 32px;
    color: #fff;
    margin: 0;
}

.shinori-header p {
    color: var(--sh-text-dim);
    margin: 4px 0 16px;
}

.shinori-header nav {
    display: flex;
    justify-content: center;
    gap: 8px;
}

.shinori-header nav a {
    padding: 8px 20px;
    border-radius: 24px;
    color: var(--sh-text-dim);
    text-decoration: none;
    font-size: 14px;
    transition: all 0.2s;
    border: 1px solid var(--sh-border);
}

.shinori-header nav a.active,
.shinori-header nav a:hover {
    background: var(--sh-accent);
    color: #fff;
    border-color: var(--sh-accent);
}

.shinori-footer {
    text-align: center;
    padding: 32px;
    color: var(--sh-text-dim);
    font-size: 12px;
    border-top: 1px solid var(--sh-border);
    margin-top: 40px;
}

/* ─── Investor Theme ─── */
.shinori-investor-theme .shinori-kpi {
    border-color: rgba(212,175,55,0.3);
}

.shinori-investor-theme .shinori-card {
    border-color: rgba(212,175,55,0.15);
}

/* ─── Print ─── */
@media print {
    .shinori-wrap { background: #fff; color: #000; }
    .shinori-card { box-shadow: none; border: 1px solid #ddd; break-inside: avoid; }
    .shinori-kpi-val { color: #000; }
    .shinori-title { color: #000; }
}

/* ─── WP Admin overrides ─── */
#adminmenuback,
#adminmenumain,
#adminmenubody,
#adminfooter,
#wpadminbar,
.update-nag,
.notice:not(.notice-success) {
    display: none !important;
}

#wpcontent {
    margin-left: 0 !important;
    padding-left: 0 !important;
    background: var(--sh-bg);
    min-height: 100vh;
}

#wpbody-content {
    background: var(--sh-bg);
}

/* ─── Responsive ─── */
@media (max-width: 600px) {
    .shinori-kpi-row {
        flex-direction: column;
    }
    .shinori-kpi {
        min-width: 100%;
    }
    .shinori-grid-2 {
        grid-template-columns: 1fr;
    }
}
