/* RT Advance Order Reporting – Admin Styles */

/* ── Wrap ─────────────────────────────────────────────────── */
.rtao-aor-wrap { max-width: 1300px; }

.rtao-aor-title {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 20px;
    color: #1d2327;
}
.rtao-aor-title .dashicons { color: #7f54b3; font-size: 26px; width: 26px; height: 26px; }
.rtao-aor-live-badge {
    background: #00a651;
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    padding: 3px 9px;
    border-radius: 20px;
    letter-spacing: .5px;
    animation: rtao-aor-pulse 2s infinite;
}
@keyframes rtao-aor-pulse { 0%,100%{opacity:1} 50%{opacity:.6} }

/* ── Filter bar ───────────────────────────────────────────── */
.rtao-aor-filters {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    padding: 14px 18px;
    margin-bottom: 18px;
    box-shadow: 0 1px 4px rgba(0,0,0,.05);
}
.rtao-aor-period-btns { display:flex; gap:6px; flex-wrap:wrap; }
.rtao-aor-period {
    background: #f0f0f1;
    border: 1px solid #dcdcde;
    border-radius: 6px;
    padding: 6px 13px;
    font-size: 13px;
    cursor: pointer;
    transition: all .15s;
    color: #3c434a;
}
.rtao-aor-period:hover { background:#7f54b3; color:#fff; border-color:#7f54b3; }
.rtao-aor-period.active { background:#7f54b3; color:#fff; border-color:#7f54b3; font-weight:600; }

.rtao-aor-custom-range {
    display: flex;
    align-items: center;
    gap: 8px;
}
.rtao-aor-custom-range input[type=date] {
    border: 1px solid #dcdcde;
    border-radius: 6px;
    padding: 6px 10px;
    font-size: 13px;
}
#rtao-aor-apply {
    background: #7f54b3;
    color: #fff;
    border: none;
    border-radius: 6px;
    padding: 7px 14px;
    cursor: pointer;
    font-size: 13px;
}

.rtao-aor-export-btn {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 6px;
    background: #2271b1;
    color: #fff;
    border: none;
    border-radius: 6px;
    padding: 8px 16px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    transition: background .15s;
}
.rtao-aor-export-btn:hover { background: #135e96; }
.rtao-aor-export-btn .dashicons { font-size: 16px; width:16px; height:16px; }

/* ── Tabs ─────────────────────────────────────────────────── */
.rtao-aor-tabs {
    display: flex;
    gap: 4px;
    border-bottom: 2px solid #7f54b3;
    margin-bottom: 20px;
}
.rtao-aor-tab {
    background: transparent;
    border: 2px solid transparent;
    border-bottom: none;
    border-radius: 8px 8px 0 0;
    padding: 9px 18px;
    font-size: 14px;
    cursor: pointer;
    color: #50575e;
    transition: all .15s;
    position: relative;
    top: 2px;
}
.rtao-aor-tab:hover { background: #f0e6ff; color: #7f54b3; }
.rtao-aor-tab.active {
    background: #fff;
    border-color: #7f54b3;
    border-bottom-color: #fff;
    color: #7f54b3;
    font-weight: 700;
}

/* ── Content / Loading ────────────────────────────────────── */
#rtao-aor-content {
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    padding: 24px;
    min-height: 300px;
    box-shadow: 0 1px 4px rgba(0,0,0,.05);
}
.rtao-aor-loading {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #666;
    font-size: 15px;
    padding: 40px 0;
    justify-content: center;
}

/* ── KPI cards ────────────────────────────────────────────── */
.rtao-aor-kpis {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 16px;
    margin-bottom: 28px;
}
.rtao-aor-kpi {
    background: linear-gradient(135deg, #7f54b3 0%, #9b6dcf 100%);
    color: #fff;
    border-radius: 12px;
    padding: 20px 22px;
    box-shadow: 0 3px 10px rgba(127,84,179,.25);
}
.rtao-aor-kpi-label { font-size:12px; opacity:.85; text-transform:uppercase; letter-spacing:.6px; margin-bottom:8px; }
.rtao-aor-kpi-value { font-size:26px; font-weight:700; line-height:1; }

/* ── Chart container ──────────────────────────────────────── */
.rtao-aor-chart-wrap { position:relative; height:280px; margin-bottom:28px; }

/* ── Tables ───────────────────────────────────────────────── */
.rtao-aor-table-wrap { overflow-x:auto; }
.rtao-aor-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13.5px;
}
.rtao-aor-table th {
    background: #f8f5ff;
    color: #7f54b3;
    padding: 10px 14px;
    text-align: left;
    border-bottom: 2px solid #e8dcf7;
    font-weight: 700;
    white-space: nowrap;
}
.rtao-aor-table td {
    padding: 9px 14px;
    border-bottom: 1px solid #f0f0f1;
    color: #1d2327;
}
.rtao-aor-table tr:last-child td { border-bottom: none; }
.rtao-aor-table tr:hover td { background: #faf7ff; }

.rtao-aor-badge {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 11.5px;
    font-weight: 600;
}
.badge-completed  { background:#d7f7e6; color:#0a6640; }
.badge-processing { background:#dbeafe; color:#1d4ed8; }
.badge-on-hold    { background:#fef3c7; color:#92400e; }
.badge-cancelled  { background:#fee2e2; color:#991b1b; }
.badge-refunded   { background:#ffe4e6; color:#9f1239; }
.badge-pending    { background:#f3f4f6; color:#374151; }

/* ── Bar meters (products) ────────────────────────────────── */
.rtao-aor-bar-cell { min-width:140px; }
.rtao-aor-bar { height:8px; background:#e9d8ff; border-radius:4px; overflow:hidden; margin-top:5px; }
.rtao-aor-bar-fill { height:100%; background:linear-gradient(90deg,#7f54b3,#b08de0); border-radius:4px; transition:width .4s; }

/* ── Dashboard widget ─────────────────────────────────────── */
.rtao-aor-widget { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.rtao-aor-stat { background:#f8f5ff; border-radius:8px; padding:12px 14px; }
.rtao-aor-stat-label { display:block; font-size:11px; color:#7f54b3; text-transform:uppercase; letter-spacing:.5px; margin-bottom:4px; }
.rtao-aor-stat-value { display:block; font-size:20px; font-weight:700; color:#1d2327; }