/*
  Global UI polish for this built Vue (View UI / iView) dashboard.
  - Pure CSS override: does NOT touch JS logic or API endpoints
  - Safe to remove: delete this file and the <link> in index.html
*/

:root{
  --app-bg:#f6f7fb;
  --card-bg:#ffffff;
  --text:#1f2937;
  --muted:#6b7280;
  --border:#e5e7eb;
  --primary:#2d8cf0;
  --primary-2:#57a3f3;
  --shadow:0 10px 30px rgba(15, 23, 42, 0.10);
  --shadow-sm:0 6px 16px rgba(15, 23, 42, 0.08);
  --radius:12px;
}

html,body{
  height:100%;
}

body{
  background:var(--app-bg) !important;
  color:var(--text) !important;
  font-size:14px;
}

/* Slightly nicer scrollbars (non-blocking, only for WebKit/Blink) */
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:rgba(100,116,139,.35);border-radius:999px;border:2px solid transparent;background-clip:content-box}
::-webkit-scrollbar-thumb:hover{background:rgba(100,116,139,.55);border:2px solid transparent;background-clip:content-box}
::-webkit-scrollbar-track{background:transparent}

/* Links */
a{color:var(--primary)}
a:hover{color:var(--primary-2)}

/* -------- Layout: header / sider / main content -------- */

.i-layout-header{
  backdrop-filter:saturate(180%) blur(10px);
  background:rgba(255,255,255,.86) !important;
  border-bottom:1px solid var(--border);
}

.i-layout-sider,
.i-layout-sider-dark{
  border-right:1px solid var(--border);
  box-shadow:none !important;
}

.i-layout-sider{
  background:#fff !important;
}

.i-layout-sider-logo{
  border-bottom:1px solid var(--border) !important;
}

/* main content area spacing / cards feel */
.i-layout-content-main{
  margin:18px !important;
}

@media (max-width: 768px){
  .i-layout-content-main{margin:12px !important;}
}

/* page header & tabs feel more modern */
.i-layout-tabs,
.i-layout-tabs-main{
  background:transparent !important;
}

.i-layout-tabs-main{
  padding:8px 0 !important;
  margin:0 12px !important;
}

.i-layout-tabs .ivu-tabs.ivu-tabs-card>.ivu-tabs-bar .ivu-tabs-tab{
  border-radius:999px !important;
  box-shadow:0 1px 0 rgba(15,23,42,.04);
  border:1px solid var(--border) !important;
}

/* -------- View UI / iView components -------- */

/* Card */
.ivu-card{
  border:1px solid var(--border) !important;
  border-radius:var(--radius) !important;
  box-shadow:var(--shadow-sm);
  overflow:hidden;
}
.ivu-card-head{
  border-bottom:1px solid var(--border) !important;
  font-weight:600;
  color:var(--text) !important;
}

/* Table */
.ivu-table{
  border:1px solid var(--border) !important;
  border-radius:var(--radius) !important;
  overflow:hidden;
}
.ivu-table:before{background:transparent !important;}
.ivu-table th{
  background:#f8fafc !important;
  color:var(--muted) !important;
  font-weight:600;
}
.ivu-table td, .ivu-table th{
  border-bottom:1px solid var(--border) !important;
}
.ivu-table-row-hover td,
.ivu-table-row-hover .ivu-table-cell{
  background:#f7fbff !important;
}

/* Inputs */
.ivu-input,
.ivu-select-selection,
.ivu-date-picker-rel,
.ivu-input-number{
  border-radius:10px !important;
  border-color:var(--border) !important;
  box-shadow:none !important;
}
.ivu-input:focus,
.ivu-select-visible .ivu-select-selection,
.ivu-date-picker-focused .ivu-date-picker-rel{
  border-color:rgba(45,140,240,.55) !important;
  box-shadow:0 0 0 4px rgba(45,140,240,.12) !important;
}

/* Buttons */
.ivu-btn{
  border-radius:10px !important;
  border-color:var(--border) !important;
}
.ivu-btn-primary{
  background:var(--primary) !important;
  border-color:var(--primary) !important;
  box-shadow:0 10px 18px rgba(45,140,240,.22);
}
.ivu-btn-primary:hover{
  background:var(--primary-2) !important;
  border-color:var(--primary-2) !important;
}

/* Modal / Drawer */
.ivu-modal-content,
.ivu-drawer-content{
  border-radius:var(--radius) !important;
  overflow:hidden;
}
.ivu-modal-header{
  border-bottom:1px solid var(--border) !important;
}
.ivu-modal-footer{
  border-top:1px solid var(--border) !important;
}

/* Dropdown / Select panel */
.ivu-select-dropdown,
.ivu-dropdown-menu{
  border:1px solid var(--border) !important;
  border-radius:12px !important;
  box-shadow:var(--shadow) !important;
}

/* Tag */
.ivu-tag{
  border-radius:999px !important;
}

/* Pagination */
.ivu-page-item,
.ivu-page-prev,
.ivu-page-next{
  border-radius:10px !important;
  border-color:var(--border) !important;
}
.ivu-page-item-active{
  border-color:rgba(45,140,240,.35) !important;
}

/* Menu: make active & hover clearer, but not too harsh */
.ivu-menu-item,
.ivu-menu-submenu-title{
  border-radius:10px;
  margin:4px 10px;
}
.ivu-menu-light.ivu-menu-vertical .ivu-menu-item:hover,
.ivu-menu-light.ivu-menu-vertical .ivu-menu-submenu-title:hover{
  background:#f3f4f6 !important;
}
.ivu-menu-light.ivu-menu-vertical .ivu-menu-item-active{
  background:#eef6ff !important;
  color:var(--primary) !important;
  font-weight:600;
}

/* Alerts / Messages */
.ivu-message-notice-content,
.ivu-notice,
.ivu-alert{
  border-radius:12px !important;
}

/* Reduce overly tight dense forms on small screens */
@media (max-width: 768px){
  .ivu-form-item{margin-bottom:14px !important;}
  .ivu-card-body{padding:14px !important;}
  .ivu-table td, .ivu-table th{padding-top:10px !important;padding-bottom:10px !important;}
}
