/* =====================================================================
   Modern UI Overrides (non-breaking)
   - Purpose: quick visual refresh without changing Angular/SmartAdmin code
   - Added: 2026-02-26
   ===================================================================== */

:root{
  --ui-bg: rgb(255, 255, 255);
  --ui-surface: #fdfdfd;
  --ui-surface-2: #737575; 
  --ui-border: rgba(97, 87, 87, 0.185);
  --ui-text: #23262c;
  --ui-text-2: rgba(15, 23, 42, .72);
  --ui-primary: #2563eb;
  --ui-primary-2: #1d4ed8;
  --ui-success: #16a34a;
  --ui-warning: #f59e0b;
  --ui-danger: #dc2626;
  --ui-radius: 10px;
  --ui-shadow: 0 8px 24px rgba(15, 23, 42, .08);
  --ui-shadow-sm: 0 2px 10px rgba(15, 23, 42, .08);
}

/* Typography */
html, body{
  height: 100%;
}
body{
  background: var(--ui-bg);
  color: var(--ui-text);
  font-family: Inter, "Noto Sans KR", "Noto Sans", system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size: 13px;
  line-height: 1.45;
}

/* Surfaces */
#main{
  background: var(--ui-bg) !important;
}
#content{
  background: transparent !important;
}
.jarviswidget,
.well,
.panel,
.panel-default,
.smart-form,
.smart-form section{
  border-radius: var(--ui-radius) !important;
}
.jarviswidget,
.panel,
.well{
  box-shadow: var(--ui-shadow-sm) !important;
  border: 1px solid var(--ui-border) !important;
  background: linear-gradient(135deg, #ffffff 0%, #fdfdfd 100%) !important;
}

/* Header */
#header{
  box-shadow: var(--ui-shadow-sm) !important;
  border-bottom: 1px solid var(--ui-border) !important;
  background: linear-gradient(135deg, #3f4754 0%, #656e77 100%) !important;
}
#header .dropdown-menu{
  background: var(--ui-surface) !important;
}

/* Sidebar */
#left-panel{
  background: linear-gradient(180deg, #ffffff 0%, #fdfdfd 100%) !important;
  border-right: 1px solid var(--ui-border) !important;
}
#left-panel nav ul li a{
  color: var(--ui-text) !important;
}
#left-panel nav ul li a:hover{
  background: rgba(37, 99, 235, .07) !important;
}
#left-panel nav ul li.active > a{
  background: rgba(37, 99, 235, .12) !important;
  color: var(--ui-primary) !important;
}
#left-panel nav ul ul{
  background: transparent !important;
}
#left-panel nav ul ul li a{
  color: var(--ui-text-2) !important;
}

/* Tabs area (legacy program tabs) */
.tab-container{
  padding: 8px 12px;
}
/* .tab-area-block .tablink{
  border-radius: 999px !important;
  border: 1px solid var(--ui-border) !important;
  background: var(--ui-surface) !important;
  box-shadow: none !important;
} */
/* .tab-area-block .tablink.active{
  border-color: rgba(37, 99, 235, .35) !important;
  background: rgba(37, 99, 235, .10) !important;
} */

/* Buttons */
.btn{
  border-radius: 999px !important;
  border: 1px solid var(--ui-border) !important;
  box-shadow: none !important;
}
.btn-primary{
  background: var(--ui-primary) !important;
  border-color: rgba(37, 99, 235, .45) !important;
}
.btn-primary:hover, .btn-primary:focus{
  background: var(--ui-primary-2) !important;
}
.btn-success{
  background: var(--ui-success) !important;
  border-color: rgba(22, 163, 74, .45) !important;
}
.btn-danger{
  background: var(--ui-danger) !important;
  border-color: rgba(220, 38, 38, .45) !important;
}
.btn-warning{
  background: var(--ui-warning) !important;
  border-color: rgba(245, 158, 11, .45) !important;
}

/* Inputs */
input.form-control, select.form-control, textarea.form-control,
.smart-form .input input, .smart-form .select select, .smart-form .textarea textarea{
  border-radius: var(--ui-radius) !important;
  border-color: var(--ui-border) !important;
  box-shadow: none !important;
}
input.form-control:focus, select.form-control:focus, textarea.form-control:focus{
  border-color: rgba(37, 99, 235, .55) !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .15) !important;
}

/* Tables */
.table, .table > thead > tr > th, .table > tbody > tr > td{
  border-color: var(--ui-border) !important;
}
.table > thead > tr > th{
  background: var(--ui-surface-2) !important;
  color: var(--ui-text) !important;
  font-weight: 600;
}
.table-hover > tbody > tr:hover{
  background: rgba(37, 99, 235, .05) !important;
}

/* Modals */
.modal-content{
  border-radius: calc(var(--ui-radius) + 2px) !important;
  border: 1px solid var(--ui-border) !important;
  box-shadow: var(--ui-shadow) !important;
}

/* Toast */
.toast, .toast-message{
  border-radius: var(--ui-radius) !important;
}

/* Reduce harsh outlines from legacy theme */
a:focus, button:focus, .btn:focus{
  outline: none !important;
}

/* Safety: keep legacy colors for status badges if any */
.label, .badge{
  border-radius: 999px !important;
}