/* OLAM-inspired global design system for Laravel / Bootstrap 4 / Layui.
   Original implementation based on supplied screenshot and markup; not an extraction
   of the reference site's proprietary custom CSS.
   Load AFTER Bootstrap, Layui and existing app CSS. Enable with <body class="olam-theme">.
   Version 1.0.0 */

:root, .olam-theme {
  color-scheme: dark;
  --ol-bg: #05050b;
  --ol-bg-2: #0c0e1b;
  --ol-surface: #141624;
  --ol-surface-2: #20212f;
  --ol-surface-hover: #282838;
  --ol-glass: rgba(29,30,45,.72);
  --ol-border: rgba(206,216,255,.14);
  --ol-border-bright: rgba(193,152,255,.32);
  --ol-text: #f4f5fb;
  --ol-muted: #9299ab;
  --ol-subtle: #6e7588;
  --ol-cyan: #26c7e6;
  --ol-blue: #548cec;
  --ol-purple: #a151e7;
  --ol-pink: #e344a7;
  --ol-success: #2dd6a4;
  --ol-warning: #f5bd64;
  --ol-danger: #fb668a;
  --v15-gradient: linear-gradient(135deg, #fff2b8 0%, #f5d77b 50%, #e9c56a 100%);
  --ol-gradient: var(--v15-gradient);
  --ol-radius-xs: 8px;
  --ol-radius-sm: 12px;
  --ol-radius: 18px;
  --ol-radius-lg: 26px;
  --ol-radius-xl: 32px;
  --ol-shadow: 0 16px 42px rgba(0,0,0,.35);
  --ol-glow: 0 12px 26px rgba(108,85,230,.27);
  --ol-focus: 0 0 0 3px rgba(43,198,231,.25);
  --ol-content-width: 1200px;
  --ol-mobile-width: 560px;
  --ol-ease: cubic-bezier(.2,.75,.3,1);
}

/* FOUNDATION */
body.olam-theme {
  min-height: 100vh;
  margin: 0;
  background: radial-gradient(ellipse 75% 38% at 50% 10%, rgba(44,116,158,.16), transparent 75%),
              radial-gradient(ellipse 70% 37% at 65% 40%, rgba(110,50,145,.13), transparent 80%), var(--ol-bg);
  color: var(--ol-text);
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 14px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
.olam-theme *, .olam-theme *::before, .olam-theme *::after { box-sizing: border-box; }
.olam-theme ::selection { background: rgba(106,103,239,.5); color: white; }
.olam-theme a { color: var(--ol-cyan); text-decoration: none; transition: color .2s ease; }
.olam-theme a:hover { color: #88e7f4; text-decoration: none; }
.olam-theme h1, .olam-theme h2, .olam-theme h3, .olam-theme h4,
.olam-theme h5, .olam-theme h6 { color: var(--ol-text); letter-spacing: -.025em; line-height: 1.25; }
.olam-theme p, .olam-theme small, .olam-theme label { color: inherit; }
.olam-theme .text-muted, .olam-theme .ol-muted { color: var(--ol-muted) !important; }
.olam-theme .ol-subtle { color: var(--ol-subtle); }
.olam-theme .ol-gradient-text { background: var(--ol-gradient); -webkit-background-clip: text; background-clip: text; color: transparent; }
.olam-theme img, .olam-theme svg { max-width: 100%; }
.olam-theme :focus-visible { outline: 2px solid var(--ol-cyan); outline-offset: 3px; }
.olam-theme .ol-container { width: min(100% - 32px, var(--ol-content-width)); margin-inline: auto; }
.olam-theme .ol-app-shell { width: min(100%, var(--ol-mobile-width)); min-height: 100dvh; margin-inline: auto; padding: 16px 16px 104px; background: rgba(0,0,0,.11); }
.olam-theme .ol-section { margin-block: 20px; }
.olam-theme .ol-section-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 14px; }
.olam-theme .ol-section-title { margin: 0; font-size: 18px; font-weight: 800; }
.olam-theme .ol-stack > * + * { margin-top: 14px; }
.olam-theme .ol-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
.olam-theme .ol-grid-3 { grid-template-columns: repeat(3, minmax(0,1fr)); }
.olam-theme .ol-grid-4 { grid-template-columns: repeat(4, minmax(0,1fr)); }

/* CARDS / SURFACES */
.olam-theme .ol-card, .olam-theme .card, .olam-theme .layui-card, .olam-theme .layui-panel {
  color: var(--ol-text);
  background: linear-gradient(135deg, rgba(37,43,60,.78), rgba(29,20,36,.78));
  border: 1px solid var(--ol-border);
  border-radius: var(--ol-radius);
  box-shadow: 0 8px 24px rgba(0,0,0,.17);
}
.olam-theme .ol-card { padding: 18px; }
.olam-theme .card-header, .olam-theme .layui-card-header { background: transparent; border-bottom: 1px solid var(--ol-border); color: var(--ol-text); }
.olam-theme .card-footer { background: transparent; border-top: 1px solid var(--ol-border); }
.olam-theme .layui-card-body { color: var(--ol-text); }
.olam-theme .ol-glass { background: var(--ol-glass); border: 1px solid var(--ol-border); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }
.olam-theme .ol-gradient-border { border: 1px solid transparent; background: linear-gradient(var(--ol-surface),var(--ol-surface)) padding-box, var(--ol-gradient) border-box; }
.olam-theme .ol-stat { padding: 16px; min-width: 0; }
.olam-theme .ol-stat-label { color: var(--ol-muted); font-size: 11px; letter-spacing: .06em; font-weight: 700; text-transform: uppercase; }
.olam-theme .ol-stat-value { font-size: clamp(20px,5vw,30px); font-weight: 850; letter-spacing: -.04em; overflow-wrap: anywhere; }
.olam-theme .ol-stat-meta { color: var(--ol-success); font-size: 12px; }
.olam-theme .ol-balance-card { border-radius: var(--ol-radius-lg); background: radial-gradient(circle at 90% 20%,rgba(227,68,167,.23),transparent 52%), linear-gradient(125deg,rgba(36,133,176,.25),rgba(64,30,94,.25)),var(--ol-surface); border: 1px solid var(--ol-border-bright); padding: 22px; box-shadow: var(--ol-shadow); }

/* BUTTONS: Bootstrap + Layui + opt-in utilities */
.olam-theme .ol-btn, .olam-theme .btn-primary, .olam-theme .layui-btn:not(.layui-btn-primary):not(.layui-btn-danger):not(.layui-btn-warm) {
  display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  min-height: 43px; padding: 10px 20px; border: 1px solid transparent;
  border-radius: var(--ol-radius-sm); background: var(--ol-gradient); color: #070914;
  font-size: 14px; line-height: 1.3; font-weight: 800; text-align: center;
  box-shadow: var(--ol-glow); cursor: pointer;
  transition: transform .2s var(--ol-ease), box-shadow .2s, opacity .2s;
}
.olam-theme .ol-btn:hover, .olam-theme .btn-primary:hover, .olam-theme .layui-btn:not(.layui-btn-primary):not(.layui-btn-danger):not(.layui-btn-warm):hover { color: #070914; opacity: .96; transform: translateY(-1px); box-shadow: 0 14px 35px rgba(112,80,230,.4); }
.olam-theme .ol-btn:active, .olam-theme .btn-primary:active { transform: translateY(0); }
.olam-theme .ol-btn:disabled, .olam-theme .btn:disabled, .olam-theme .layui-btn-disabled { cursor: not-allowed; opacity: .5; box-shadow: none; }
.olam-theme .ol-btn-secondary, .olam-theme .btn-secondary, .olam-theme .layui-btn-primary { background: rgba(255,255,255,.065); border: 1px solid var(--ol-border); color: var(--ol-text); box-shadow: none; }
.olam-theme .ol-btn-secondary:hover, .olam-theme .btn-secondary:hover, .olam-theme .layui-btn-primary:hover { color: white; background: rgba(255,255,255,.12); border-color: var(--ol-border-bright); }
.olam-theme .ol-btn-danger, .olam-theme .btn-danger, .olam-theme .layui-btn-danger { background: var(--ol-danger); border-color: transparent; color: #140710; }
.olam-theme .ol-btn-block { display: flex; width: 100%; }
.olam-theme .ol-btn-pill { border-radius: 999px; }
.olam-theme .ol-btn-lg { min-height: 56px; padding: 15px 22px; font-size: 16px; }
.olam-theme .ol-icon-btn { display: inline-grid; place-items: center; width: 42px; height: 42px; border: 1px solid var(--ol-border); border-radius: 13px; background: var(--ol-surface); color: var(--ol-text); }

/* FORMS / AUTH */
.olam-theme .form-control, .olam-theme .custom-select, .olam-theme .layui-input,
.olam-theme .layui-select, .olam-theme .layui-textarea, .olam-theme .ol-input,
.olam-theme input[type="tel"], .olam-theme input[type="email"], .olam-theme input[type="password"],
.olam-theme input[type="text"], .olam-theme input[type="number"], .olam-theme select, .olam-theme textarea {
  background: rgba(255,255,255,.075); color: var(--ol-text); border: 1px solid var(--ol-border);
  border-radius: var(--ol-radius-sm); min-height: 46px; padding: 10px 14px; box-shadow: none;
  max-width: 100%;
}
.olam-theme input::placeholder, .olam-theme textarea::placeholder { color: #848c9e; opacity: 1; }
.olam-theme input:focus, .olam-theme textarea:focus, .olam-theme select:focus,
.olam-theme .form-control:focus, .olam-theme .layui-input:focus, .olam-theme .layui-textarea:focus {
  background: rgba(255,255,255,.09); color: white; border-color: rgba(58,202,235,.65) !important; box-shadow: var(--ol-focus);
  outline: 0;
}
.olam-theme input:disabled, .olam-theme select:disabled, .olam-theme textarea:disabled { opacity: .56; cursor: not-allowed; }
.olam-theme select option { background: #1c1b2a; color: white; }
.olam-theme .form-label, .olam-theme .ol-label, .olam-theme .layui-form-label { display: block; margin-bottom: 6px; font-size: 12px; font-weight: 750; letter-spacing: .045em; text-transform: uppercase; color: var(--ol-muted); }
.olam-theme .ol-form-group { margin-bottom: 20px; }
.olam-theme .ol-input-wrap { display: flex; gap: 10px; align-items: center; min-height: 51px; padding: 0 14px; border: 1px solid var(--ol-border); border-radius: var(--ol-radius-sm); background: rgba(255,255,255,.075); }
.olam-theme .ol-input-wrap:focus-within { border-color: var(--ol-cyan); box-shadow: var(--ol-focus); }
.olam-theme .ol-input-wrap > input { flex: 1; width: 1%; min-width: 0; background: transparent; border: 0; box-shadow: none; }
.olam-theme .ol-input-wrap > input:focus { background: transparent; box-shadow: none; border: 0 !important; }
.olam-theme .ol-input-icon { color: var(--ol-muted); font-size: 18px; flex-shrink: 0; }
.olam-theme .invalid-feedback, .olam-theme .text-danger { color: var(--ol-danger) !important; }
.olam-theme .is-invalid { border-color: var(--ol-danger) !important; }
.olam-theme .ol-auth-shell { width: min(100% - 32px, 520px); min-height: 100dvh; margin: 0 auto; display: flex; flex-direction: column; justify-content: center; padding: 34px 0; }
.olam-theme .ol-auth-logo { display: grid; place-items: center; width: 78px; height: 78px; margin: 0 auto 18px; border-radius: 24px; background: var(--ol-gradient); color: #03050d; font-weight: 900; font-size: 29px; box-shadow: var(--ol-glow); }
.olam-theme .ol-auth-title { margin: 16px 0 8px; font-size: clamp(30px,7vw,40px); font-weight: 900; text-align: center; }
.olam-theme .ol-auth-subtitle { margin: 0 auto 24px; color: var(--ol-muted); text-align: center; }
.olam-theme .ol-auth-card { position: relative; overflow: hidden; padding: 24px; border-radius: 30px; border: 1px solid transparent; background: linear-gradient(145deg,rgba(26,33,45,.94),rgba(31,19,31,.94)) padding-box, linear-gradient(135deg,rgba(38,199,230,.42),rgba(227,68,167,.42)) border-box; box-shadow: var(--ol-shadow); }
.olam-theme .ol-tabs { display: grid; grid-auto-columns: 1fr; grid-auto-flow: column; gap: 4px; padding: 5px; border: 1px solid var(--ol-border); border-radius: 15px; background: rgba(255,255,255,.06); }
.olam-theme .ol-tab { display: flex; justify-content: center; align-items: center; padding: 12px; min-height: 44px; border-radius: 11px; color: var(--ol-muted); font-weight: 800; }
.olam-theme .ol-tab.active, .olam-theme .ol-tab[aria-selected="true"] { background: var(--ol-gradient); color: #070914; box-shadow: var(--ol-glow); }

/* NAVIGATION */
.olam-theme .ol-topbar { display: flex; justify-content: space-between; align-items: center; min-height: 62px; padding: 10px 16px; border-bottom: 1px solid var(--ol-border); background: rgba(9,10,18,.82); backdrop-filter: blur(18px); }
.olam-theme .ol-brand { color: white; font-weight: 900; letter-spacing: -.02em; font-size: 18px; }
.olam-theme .ol-navbar { display: flex; gap: 8px; align-items: center; }
.olam-theme .ol-nav-link { display: inline-flex; align-items: center; gap: 8px; padding: 10px 12px; border-radius: 10px; color: var(--ol-muted); font-weight: 650; }
.olam-theme .ol-nav-link:hover, .olam-theme .ol-nav-link.active, .olam-theme .ol-nav-link[aria-current="page"] { background: rgba(112,103,221,.14); color: var(--ol-text); }
.olam-theme .ol-bottom-nav { position: fixed; z-index: 1000; bottom: 0; left: 50%; transform: translateX(-50%); width: min(100%, var(--ol-mobile-width)); display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); padding: 8px 6px calc(8px + env(safe-area-inset-bottom)); border: 1px solid var(--ol-border); border-bottom: 0; border-radius: 20px 20px 0 0; background: rgba(15,16,30,.95); backdrop-filter: blur(20px); box-shadow: 0 -8px 30px rgba(0,0,0,.3); }
.olam-theme .ol-bottom-nav a { display: flex; flex-direction: column; gap: 3px; align-items: center; justify-content: center; min-height: 50px; color: var(--ol-muted); font-size: 11px; font-weight: 650; }
.olam-theme .ol-bottom-nav a i, .olam-theme .ol-bottom-nav a svg { font-size: 20px; }
.olam-theme .ol-bottom-nav a.active, .olam-theme .ol-bottom-nav a[aria-current="page"] { color: var(--ol-cyan); }
/* Legacy existing footer menu: only recolor; don't reposition unrelated footer elements. */
.olam-theme .bottom-menu-section, .olam-theme .bottom-menu { background: rgba(15,16,30,.96) !important; border-color: var(--ol-border) !important; }
.olam-theme .bottom-menu a, .olam-theme .bottom-menu p { color: var(--ol-muted) !important; }
.olam-theme .bottom-menu a.active, .olam-theme .bottom-menu a.active p { color: var(--ol-cyan) !important; }
.olam-theme .layui-nav { background: var(--ol-surface); }
.olam-theme .layui-nav-tree .layui-this, .olam-theme .layui-nav-tree .layui-this > a { background: rgba(111,100,220,.22) !important; color: var(--ol-cyan) !important; }

/* LISTS / TABLES / ADMIN */
.olam-theme .table, .olam-theme .layui-table { color: var(--ol-text); background: transparent; }
.olam-theme .table th, .olam-theme .table td, .olam-theme .layui-table th, .olam-theme .layui-table td { border-color: var(--ol-border); vertical-align: middle; }
.olam-theme .table thead th, .olam-theme .layui-table th { color: var(--ol-muted); font-size: 12px; text-transform: uppercase; letter-spacing: .035em; }
.olam-theme .table-striped tbody tr:nth-of-type(odd), .olam-theme .layui-table[lay-even] tbody tr:nth-child(even) { background: rgba(255,255,255,.035); }
.olam-theme .table-hover tbody tr:hover, .olam-theme .layui-table-hover { color: white; background: rgba(255,255,255,.07); }
.olam-theme .ol-table-wrap { overflow-x: auto; border: 1px solid var(--ol-border); border-radius: var(--ol-radius); }
.olam-theme .ol-list { display: flex; flex-direction: column; gap: 10px; }
.olam-theme .ol-list-item { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 14px 16px; border: 1px solid var(--ol-border); border-radius: var(--ol-radius-sm); background: rgba(255,255,255,.035); }
.olam-theme .ol-list-item > * { min-width: 0; }
.olam-theme .ol-pill, .olam-theme .badge { display: inline-flex; align-items: center; gap: 6px; padding: 4px 9px; border-radius: 999px; background: rgba(112,103,221,.18); color: #d5cbff; font-size: 11px; font-weight: 800; }
.olam-theme .ol-pill-success { background: rgba(45,214,164,.13); color: var(--ol-success); }
.olam-theme .ol-pill-warning { background: rgba(245,189,100,.13); color: var(--ol-warning); }
.olam-theme .ol-pill-danger { background: rgba(251,102,138,.12); color: var(--ol-danger); }
.olam-theme .progress, .olam-theme .layui-progress { background: rgba(255,255,255,.10); border-radius: 100px; overflow: hidden; }
.olam-theme .progress-bar, .olam-theme .layui-progress-bar { background: var(--ol-gradient); border-radius: inherit; }
.olam-theme .pagination .page-link, .olam-theme .layui-laypage a { background: var(--ol-surface); border-color: var(--ol-border); color: var(--ol-text); }
.olam-theme .pagination .active .page-link { background: var(--ol-purple); border-color: var(--ol-purple); }

/* MODALS / DROPDOWNS / NOTICES */
.olam-theme .modal-content, .olam-theme .dropdown-menu, .olam-theme .layui-layer, .olam-theme .layui-nav-child { background: #1a1b2b; color: var(--ol-text); border: 1px solid var(--ol-border); border-radius: var(--ol-radius); box-shadow: var(--ol-shadow); }
.olam-theme .modal-header, .olam-theme .modal-footer, .olam-theme .layui-layer-title { border-color: var(--ol-border); background: transparent; color: var(--ol-text); }
.olam-theme .dropdown-item, .olam-theme .layui-nav-child a { color: var(--ol-text); }
.olam-theme .dropdown-item:hover, .olam-theme .dropdown-item:focus { background: var(--ol-surface-hover); color: white; }
.olam-theme .close { color: white; text-shadow: none; opacity: .7; }
.olam-theme .alert, .olam-theme .ol-alert { padding: 12px 14px; border: 1px solid var(--ol-border); border-radius: 12px; color: var(--ol-text); background: rgba(255,255,255,.06); }
.olam-theme .alert-success { border-color: rgba(45,214,164,.34); background: rgba(45,214,164,.1); color: #a3f4d8; }
.olam-theme .alert-danger { border-color: rgba(251,102,138,.34); background: rgba(251,102,138,.1); color: #ffb6c7; }
.olam-theme .alert-warning { border-color: rgba(245,189,100,.34); background: rgba(245,189,100,.1); color: #ffe1ad; }
.olam-theme hr { border-color: var(--ol-border); }

/* MOTION & ACCESSIBILITY */
@keyframes ol-fade-up { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
@keyframes ol-glow-pulse { 0%,100% { box-shadow: 0 0 20px rgba(121,89,231,.23); } 50% { box-shadow: 0 0 32px rgba(121,89,231,.4); } }
.olam-theme .ol-reveal { animation: ol-fade-up .55s var(--ol-ease) both; }
.olam-theme .ol-pulse { animation: ol-glow-pulse 3s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) { .olam-theme *, .olam-theme *::before, .olam-theme *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }
@media (max-width: 575.98px) { .olam-theme .ol-grid-3, .olam-theme .ol-grid-4 { grid-template-columns: repeat(2,minmax(0,1fr)); } .olam-theme .ol-auth-card { padding: 20px 16px; } .olam-theme .ol-stat-value { font-size: 22px; } .olam-theme .ol-card { padding: 15px; } }
@media (max-width: 360px) { .olam-theme .ol-grid { gap: 8px; } .olam-theme .ol-app-shell { padding-inline: 12px; } .olam-theme .ol-bottom-nav a { font-size: 10px; } }