:root {
  --rr-primary:#2563EB;
  --rr-primary-hover:#1D4ED8;
  --rr-nav:#0F3D8A;
  --rr-nav-deep:#0A2D68;
  --rr-bg:#F6F8FC;
  --rr-surface:#FFFFFF;
  --rr-border:#E2E8F0;
  --rr-border-strong:#CBD5E1;
  --rr-text:#172033;
  --rr-muted:#667085;
  --rr-success:#15803D;
  --rr-warning:#B45309;
  --rr-danger:#B42318;
  --rr-info:#0369A1;
  --rr-radius-sm:8px;
  --rr-radius:12px;
  --rr-radius-lg:16px;
  --rr-shadow:0 1px 2px rgba(15,23,42,.04),0 8px 24px rgba(15,23,42,.06);
  --rr-shadow-soft:0 10px 30px rgba(15,61,138,.08);
  --rr-sidebar:264px;
  --rr-topbar:68px;
}
html { color-scheme:light; background:var(--rr-bg); }
body.rr-app { margin:0; background:var(--rr-bg)!important; color:var(--rr-text); font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
body.rr-app * { box-sizing:border-box; }
body.rr-app :focus-visible { outline:3px solid rgba(37,99,235,.25); outline-offset:2px; }
body.rr-app a { text-underline-offset:3px; }
body.rr-app img { max-width:100%; }
body.rr-app h1,body.rr-app h2,body.rr-app h3,body.rr-app h4 { color:var(--rr-text); letter-spacing:-.015em; }
body.rr-app p { line-height:1.6; }

/* App shell */
.rr-shell { min-height:100vh; display:flex; background:var(--rr-bg); }
.rr-sidebar { position:fixed; inset:0 auto 0 0; z-index:60; width:var(--rr-sidebar); overflow-y:auto; background:linear-gradient(180deg,var(--rr-nav) 0%,var(--rr-nav-deep) 100%); color:#fff; border-right:1px solid rgba(255,255,255,.08); }
.rr-sidebar__brand { min-height:76px; display:flex; align-items:center; gap:11px; padding:18px 20px; border-bottom:1px solid rgba(255,255,255,.12); font-size:17px; font-weight:800; letter-spacing:.01em; }
.rr-sidebar__brand-mark { width:36px; height:36px; border-radius:10px; display:grid; place-items:center; background:#fff; color:var(--rr-nav); font-weight:900; box-shadow:0 4px 14px rgba(0,0,0,.12); }
.rr-sidebar__section { padding:18px 12px 8px; color:#BFDBFE; font-size:10px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.rr-sidebar__link { min-height:42px; margin:2px 10px; padding:10px 12px; display:flex; align-items:center; gap:11px; color:#EAF2FF!important; text-decoration:none!important; border-radius:9px; font-size:13px; font-weight:600; transition:background .16s ease,color .16s ease; }
.rr-sidebar__link:hover,.rr-sidebar__link.is-active,.rr-sidebar__link.active { background:rgba(255,255,255,.12); color:#fff!important; }
.rr-sidebar__link i,.rr-sidebar__link svg { width:18px; text-align:center; opacity:.92; }
.rr-shell__content { width:calc(100% - var(--rr-sidebar)); min-width:0; margin-left:var(--rr-sidebar); }
.rr-topbar { min-height:var(--rr-topbar); position:sticky; top:0; z-index:40; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 24px; background:rgba(255,255,255,.96); backdrop-filter:saturate(160%) blur(12px); border-bottom:1px solid var(--rr-border); }
.rr-topbar__title { font-size:17px; font-weight:750; color:var(--rr-text); }
.rr-main { min-width:0; }
.rr-page { width:100%; max-width:1500px; margin:0 auto; }
.rr-page-header { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:20px; }
.rr-page-header h1,.rr-page-header h2 { margin:0; font-size:clamp(22px,2.4vw,30px); line-height:1.2; }
.rr-page-header p { margin:6px 0 0; color:var(--rr-muted); font-size:14px; }
.rr-sidebar-overlay { display:none; position:fixed; inset:0; z-index:55; background:rgba(15,23,42,.46); backdrop-filter:blur(2px); }

/* Cards / layout */
.rr-card { background:var(--rr-surface); border:1px solid var(--rr-border); border-radius:var(--rr-radius); box-shadow:0 1px 2px rgba(15,23,42,.03); }
.rr-card--padded { padding:20px; }
.rr-card__header { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:17px 20px; border-bottom:1px solid var(--rr-border); }
.rr-card__title { margin:0; font-size:15px; font-weight:750; }
.rr-card__body { padding:20px; }
.rr-grid { display:grid; gap:16px; }
.rr-grid--2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.rr-grid--3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.rr-grid--4 { grid-template-columns:repeat(4,minmax(0,1fr)); }
.rr-stat-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-bottom:20px; }
.rr-stat { min-height:118px; padding:17px 18px; background:#fff; border:1px solid var(--rr-border); border-radius:var(--rr-radius); box-shadow:0 1px 2px rgba(15,23,42,.03); }
.rr-stat__label { color:var(--rr-muted); font-size:12px; font-weight:650; }
.rr-stat__value { margin-top:8px; font-size:24px; line-height:1.15; font-weight:800; color:var(--rr-text); }
.rr-service-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:14px; }
.rr-service-card { display:block; min-height:150px; padding:18px; background:#fff; border:1px solid var(--rr-border); border-radius:var(--rr-radius); text-decoration:none!important; color:var(--rr-text)!important; box-shadow:0 1px 2px rgba(15,23,42,.03); transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease; }
.rr-service-card:hover { transform:translateY(-2px); border-color:#BFDBFE; box-shadow:var(--rr-shadow); }
.rr-service-card__icon { width:38px; height:38px; display:grid; place-items:center; border-radius:10px; background:#EFF6FF; color:var(--rr-primary); margin-bottom:14px; }

/* Buttons */
.rr-btn { min-height:40px; display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:9px 14px; border:1px solid transparent; border-radius:10px; font-size:14px; font-weight:650; line-height:1.25; text-decoration:none!important; cursor:pointer; transition:background .16s ease,border-color .16s ease,box-shadow .16s ease,transform .16s ease; }
.rr-btn:hover { transform:translateY(-1px); }
.rr-btn--primary { background:var(--rr-primary); color:#fff!important; }
.rr-btn--primary:hover { background:var(--rr-primary-hover); }
.rr-btn--secondary { background:#fff; color:var(--rr-text)!important; border-color:var(--rr-border-strong); }
.rr-btn--secondary:hover { background:#F8FAFC; border-color:#94A3B8; }
.rr-btn--danger { background:#fff; color:var(--rr-danger)!important; border-color:#FECACA; }
.rr-btn--danger:hover { background:#FEF2F2; }
.rr-icon-btn { width:40px; height:40px; padding:0; display:inline-grid; place-items:center; border:1px solid var(--rr-border); border-radius:10px; background:#fff; color:var(--rr-text); cursor:pointer; }

/* Forms */
.rr-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.rr-form-group { margin-bottom:16px; }
.rr-label { display:block; margin-bottom:7px; font-size:13px; font-weight:700; color:#344054; }
.rr-field,.rr-select,.rr-textarea,.rr-file { width:100%; min-height:42px; padding:9px 12px; border:1px solid var(--rr-border-strong); border-radius:10px; background:#fff; color:var(--rr-text); font:inherit; font-size:14px; box-shadow:0 1px 2px rgba(16,24,40,.03); transition:border-color .16s ease,box-shadow .16s ease; }
.rr-textarea { min-height:104px; resize:vertical; }
.rr-field:focus,.rr-select:focus,.rr-textarea:focus,.rr-file:focus { border-color:#93C5FD; box-shadow:0 0 0 3px rgba(37,99,235,.10); outline:none; }
.rr-help { margin-top:6px; color:var(--rr-muted); font-size:12px; line-height:1.45; }

/* Tables */
.rr-table-wrap { width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; border:1px solid var(--rr-border); border-radius:var(--rr-radius); background:#fff; }
.rr-table { width:100%; border-collapse:collapse; min-width:680px; }
.rr-table th { padding:12px 14px; background:#F8FAFC; color:#475467; font-size:12px; font-weight:700; text-align:left; border-bottom:1px solid var(--rr-border); white-space:nowrap; }
.rr-table td { padding:13px 14px; border-bottom:1px solid #EEF2F6; font-size:13px; vertical-align:middle; color:#344054; }
.rr-table tbody tr:hover { background:#FAFCFF; }
.rr-table tbody tr:last-child td { border-bottom:0; }
.rr-toolbar { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; margin-bottom:14px; }
.rr-toolbar__group { display:flex; align-items:center; flex-wrap:wrap; gap:9px; }

/* Badges / alerts */
.rr-badge { display:inline-flex; align-items:center; gap:5px; min-height:24px; padding:3px 8px; border-radius:999px; background:#F2F4F7; color:#475467; font-size:11px; font-weight:750; white-space:nowrap; }
.rr-badge--success { background:#ECFDF3; color:var(--rr-success); }
.rr-badge--warning { background:#FFFAEB; color:var(--rr-warning); }
.rr-badge--danger { background:#FEF3F2; color:var(--rr-danger); }
.rr-badge--info { background:#EFF8FF; color:var(--rr-info); }
.rr-alert { padding:12px 14px; margin-bottom:14px; border:1px solid var(--rr-border); border-radius:10px; background:#F8FAFC; color:#344054; font-size:13px; line-height:1.5; }
.rr-alert--success { background:#F0FDF4; border-color:#BBF7D0; color:#166534; }
.rr-alert--warning { background:#FFFBEB; border-color:#FDE68A; color:#92400E; }
.rr-alert--danger { background:#FEF2F2; border-color:#FECACA; color:#991B1B; }
.rr-alert--info { background:#EFF6FF; border-color:#BFDBFE; color:#1E40AF; }

/* Modal / pagination / empty */
.rr-modal { border:1px solid var(--rr-border); border-radius:var(--rr-radius-lg); background:#fff; box-shadow:0 24px 80px rgba(15,23,42,.22); }
.rr-pagination { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:8px; margin-top:16px; }
.rr-empty { padding:40px 20px; text-align:center; color:var(--rr-muted); }

/* Compatibility layer: modernize existing first-party markup without changing backend selectors. */
body.rr-app .container,body.rr-app .content,body.rr-app .main-content,body.rr-app main { max-width:100%; }
body.rr-app .card,body.rr-app .panel,body.rr-app .box,body.rr-app .content-card,body.rr-app .form-card,body.rr-app .table-card,body.rr-app .stat-card,body.rr-app .service-card { background:#fff; border:1px solid var(--rr-border); border-radius:var(--rr-radius)!important; box-shadow:0 1px 2px rgba(15,23,42,.03)!important; }
body.rr-app .card:hover,body.rr-app .service-card:hover { border-color:#BFDBFE; }
body.rr-app input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),body.rr-app select,body.rr-app textarea { border-color:var(--rr-border-strong)!important; border-radius:10px!important; box-shadow:none!important; }
body.rr-app input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):focus,body.rr-app select:focus,body.rr-app textarea:focus { border-color:#93C5FD!important; box-shadow:0 0 0 3px rgba(37,99,235,.10)!important; outline:none!important; }
body.rr-app button,body.rr-app .btn,body.rr-app [class*="btn-"] { border-radius:10px; }
body.rr-app table { width:100%; }
body.rr-app th { background:#F8FAFC; color:#475467; }
body.rr-app nav:not(.rr-sidebar) { border-color:var(--rr-border)!important; }
body.rr-app .header,body.rr-app .topbar,body.rr-app .navbar { box-shadow:none!important; }
body.rr-app .alert-success,body.rr-app .success-message { background:#F0FDF4!important; color:#166534!important; border-color:#BBF7D0!important; }
body.rr-app .alert-error,body.rr-app .alert-danger,body.rr-app .error-message { background:#FEF2F2!important; color:#991B1B!important; border-color:#FECACA!important; }
body.rr-app .status-success,body.rr-app .successful,body.rr-app .completed,body.rr-app .approved { color:var(--rr-success); }
body.rr-app .status-failed,body.rr-app .failed,body.rr-app .rejected { color:var(--rr-danger); }

/* Landing/auth refinements */
body.rr-app .hero-pattern { background:#0F3D8A!important; background-image:radial-gradient(circle at 15% 20%,rgba(96,165,250,.20),transparent 38%),radial-gradient(circle at 86% 80%,rgba(37,99,235,.22),transparent 34%)!important; }
body.rr-app .glass-card { background:rgba(255,255,255,.97)!important; border:1px solid rgba(226,232,240,.95)!important; box-shadow:0 8px 28px rgba(15,23,42,.07)!important; backdrop-filter:blur(10px); }
body.rr-app .bg-gradient-to-br,body.rr-app .bg-gradient-to-r { }
body.rr-app .auth-container,body.rr-app .login-container,body.rr-app .register-container { background:transparent; }

/* Desktop sidebar compatibility for common existing names. */
@media (min-width:1024px) {
  body.rr-app .sidebar:not(.rr-sidebar),body.rr-app aside.sidebar,body.rr-app .admin-sidebar { background:linear-gradient(180deg,var(--rr-nav),var(--rr-nav-deep))!important; color:#fff; box-shadow:none!important; }
  body.rr-app .sidebar a,body.rr-app .admin-sidebar a { border-radius:9px!important; }
}

@media (max-width:1023px) {
  .rr-sidebar { transform:translateX(-102%); transition:transform .2s ease; box-shadow:18px 0 46px rgba(15,23,42,.18); }
  .rr-shell__content { width:100%; margin-left:0; }
  html.rr-nav-open .rr-sidebar { transform:translateX(0); }
  html.rr-nav-open .rr-sidebar-overlay { display:block; }
  .rr-topbar { padding:10px 16px; }
  .rr-stat-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:767px) {
  .rr-desktop-only{display:none!important}
  .rr-page{padding:16px}
  .rr-page-header{flex-direction:column;align-items:stretch}
  .rr-grid--2,.rr-grid--3,.rr-grid--4,.rr-form-grid{grid-template-columns:1fr}
  .rr-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .rr-stat{min-height:104px;padding:14px}
  .rr-stat__value{font-size:21px}
  .rr-toolbar,.rr-toolbar__group{align-items:stretch}
  .rr-toolbar__group{width:100%}
  .rr-toolbar__group .rr-field,.rr-toolbar__group .rr-select{flex:1 1 160px}
  .rr-btn{min-height:42px}
  body.rr-app{overflow-x:hidden}
  body.rr-app .container{width:100%!important;max-width:100%!important}
}
@media (min-width:768px) { .rr-mobile-only{display:none!important} .rr-page{padding:24px} }
@media (max-width:420px) { .rr-stat-grid{grid-template-columns:1fr} }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; } }

/* Safe automatic decoration targets used by recordirrig-ui.js */
body.rr-app .rr-auto-card { background:#fff!important; border:1px solid var(--rr-border)!important; border-radius:var(--rr-radius)!important; box-shadow:0 1px 2px rgba(15,23,42,.03)!important; }
body.rr-app .rr-auto-table-wrap { width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; border:1px solid var(--rr-border); border-radius:var(--rr-radius); background:#fff; }
body.rr-app .rr-auto-table-wrap > table { margin:0!important; min-width:680px; }
body.rr-app table.rr-table th { background:#F8FAFC!important; color:#475467!important; font-size:12px; font-weight:700; }
body.rr-app table.rr-table td,body.rr-app table.rr-table th { border-color:#EEF2F6!important; }
body.rr-app .rr-badge { width:auto!important; }
body.rr-auth { min-height:100vh; background:linear-gradient(145deg,#EFF6FF 0%,#F8FAFC 48%,#EEF2FF 100%)!important; }
body.rr-auth::before { content:""; position:fixed; inset:0; pointer-events:none; background:radial-gradient(circle at 12% 10%,rgba(37,99,235,.08),transparent 26%),radial-gradient(circle at 88% 88%,rgba(15,61,138,.08),transparent 28%); }
body.rr-auth form { position:relative; }
body.rr-auth .card,body.rr-auth .login-card,body.rr-auth .register-card,body.rr-auth .auth-card,body.rr-auth .glass-card { border:1px solid var(--rr-border)!important; box-shadow:var(--rr-shadow-soft)!important; }
body.rr-user .sidebar,body.rr-admin .sidebar,body.rr-admin .admin-sidebar { background:linear-gradient(180deg,var(--rr-nav),var(--rr-nav-deep))!important; }
body.rr-user .sidebar a,body.rr-admin .sidebar a,body.rr-admin .admin-sidebar a { color:#EAF2FF; }
body.rr-user .sidebar a:hover,body.rr-admin .sidebar a:hover,body.rr-admin .admin-sidebar a:hover { background:rgba(255,255,255,.10)!important; color:#fff!important; }
body.rr-admin .main-content,body.rr-admin .content,body.rr-user .main-content,body.rr-user .content { background:var(--rr-bg)!important; }
body.rr-admin .modal-content,body.rr-user .modal-content { border-radius:var(--rr-radius-lg)!important; border:1px solid var(--rr-border)!important; box-shadow:0 24px 80px rgba(15,23,42,.20)!important; }
body.rr-app .pagination a,body.rr-app .pagination button,body.rr-app .page-link { min-height:36px; min-width:36px; display:inline-flex; align-items:center; justify-content:center; border-radius:8px!important; border:1px solid var(--rr-border)!important; background:#fff!important; color:var(--rr-text)!important; }
body.rr-app .pagination .active,body.rr-app .page-link.active { background:var(--rr-primary)!important; color:#fff!important; border-color:var(--rr-primary)!important; }
@media (max-width:767px) {
  body.rr-app .rr-auto-table-wrap { margin-left:0; margin-right:0; }
  body.rr-auth { padding-left:14px!important; padding-right:14px!important; }
}

/* Existing shell harmonization — selectors only, no business behavior changes. */
body.rr-user #sidebar,body.rr-admin #sidebar { background:linear-gradient(180deg,var(--rr-nav) 0%,var(--rr-nav-deep) 100%)!important; border-right:1px solid rgba(255,255,255,.08)!important; }
body.rr-user #sidebar a,body.rr-admin #sidebar a { color:#EAF2FF!important; border-radius:9px!important; }
body.rr-user #sidebar a:hover,body.rr-admin #sidebar a:hover { background:rgba(255,255,255,.11)!important; color:#fff!important; }
body.rr-user #sidebar .sidebar-section-title,body.rr-admin #sidebar .sidebar-section-title { color:#BFDBFE!important; text-transform:uppercase; letter-spacing:.1em; font-size:10px!important; font-weight:800!important; }
body.rr-user header:not(.rr-topbar),body.rr-admin header:not(.rr-topbar) { background:#fff!important; color:var(--rr-text)!important; border-bottom:1px solid var(--rr-border)!important; box-shadow:none!important; }
body.rr-user .content,body.rr-user .main-content,body.rr-admin .content,body.rr-admin .main-content { background:var(--rr-bg)!important; }
body.rr-user .balance-card { background:linear-gradient(135deg,#0F3D8A 0%,#2563EB 100%)!important; border:1px solid rgba(255,255,255,.18)!important; box-shadow:0 12px 28px rgba(15,61,138,.16)!important; border-radius:16px!important; }
body.rr-user .services-grid { gap:14px!important; }
body.rr-user .service-card { border:1px solid var(--rr-border)!important; background:#fff!important; box-shadow:0 1px 2px rgba(15,23,42,.03)!important; }
body.rr-user .service-card:hover { border-color:#BFDBFE!important; box-shadow:0 8px 24px rgba(15,61,138,.08)!important; }
body.rr-user .service-icon { background:#EFF6FF!important; color:var(--rr-primary)!important; }
body.rr-admin #sidebar nav a { min-height:42px; padding-top:10px!important; padding-bottom:10px!important; margin-bottom:2px; }
body.rr-admin #sidebar nav a.bg-secondary\/10,body.rr-admin #sidebar nav a.text-secondary { background:rgba(255,255,255,.13)!important; color:#fff!important; border-color:rgba(255,255,255,.14)!important; }
body.rr-admin .shadow-xl,body.rr-admin .shadow-2xl,body.rr-user .shadow-xl,body.rr-user .shadow-2xl { box-shadow:var(--rr-shadow)!important; }
body.rr-admin .rounded-2xl,body.rr-user .rounded-2xl { border-radius:var(--rr-radius-lg)!important; }
body.rr-admin .rounded-xl,body.rr-user .rounded-xl { border-radius:var(--rr-radius)!important; }
