/* Morandi palette + smooth interactions (non-breaking) */
:root {
  --mrd-primary: #6f8a8e;     /* muted blue-gray */
  --mrd-success: #7c8f7a;     /* muted green */
  --mrd-warning: #9f8f68;     /* muted mustard */
  --mrd-info:    #6f86a0;     /* muted blue */
  --mrd-danger:  #a86f6f;     /* muted red */
  --mrd-secondary:#888888;    /* neutral gray */
  --mrd-dark:    #4a4a4a;     /* deep gray for text */
  --mrd-light:   #f2f1ed;     /* off-white */

  --mrd-bg:      #f6f5f2;     /* page background */
  --mrd-card:    #ffffff;     /* card background */
  --mrd-border:  #e6e3dd;     /* soft border */

  --ease-smooth: cubic-bezier(0.22, 1, 0.36, 1);
  --shadow-soft: 0 8px 18px rgba(0,0,0,0.06);
  --shadow-hover: 0 12px 28px rgba(0,0,0,0.10);
}

html, body { color: var(--mrd-dark); background: var(--mrd-bg); }

/* Typography and spacing refinements */
body { letter-spacing: .2px; }
.navbar-brand { letter-spacing: .3px; }

/* Global smooth transitions for interactive elements */
a, .btn, .card, .form-control, .alert, .badge, .navbar, .dropdown-menu {
  transition: all .25s var(--ease-smooth);
}

/* Bootstrap tone overrides to Morandi palette (non-breaking class names) */
.bg-primary { background-color: var(--mrd-primary) !important; }
.bg-success { background-color: var(--mrd-success) !important; }
.bg-warning { background-color: var(--mrd-warning) !important; }
.bg-info    { background-color: var(--mrd-info) !important; }
.bg-danger  { background-color: var(--mrd-danger) !important; }
.bg-secondary { background-color: var(--mrd-secondary) !important; }

.text-primary { color: var(--mrd-primary) !important; }
.text-success { color: var(--mrd-success) !important; }
.text-warning { color: var(--mrd-warning) !important; }
.text-info    { color: var(--mrd-info) !important; }
.text-danger  { color: var(--mrd-danger) !important; }
.text-secondary { color: var(--mrd-secondary) !important; }

.btn-primary {
  background-color: var(--mrd-primary) !important;
  border-color: var(--mrd-primary) !important;
  box-shadow: 0 2px 0 rgba(0,0,0,0.05);
}
.btn-primary:hover { filter: brightness(1.05); transform: translateY(-1px); box-shadow: var(--shadow-soft); }

.btn-success { background-color: var(--mrd-success) !important; border-color: var(--mrd-success) !important; }
.btn-warning { background-color: var(--mrd-warning) !important; border-color: var(--mrd-warning) !important; color: #fff !important; }
.btn-info    { background-color: var(--mrd-info) !important; border-color: var(--mrd-info) !important; }
.btn-danger  { background-color: var(--mrd-danger) !important; border-color: var(--mrd-danger) !important; }
.btn-outline-primary { color: var(--mrd-primary) !important; border-color: var(--mrd-primary) !important; }
.btn-outline-primary:hover { background: var(--mrd-primary) !important; color: #fff !important; }

/* Navbar */
.navbar.bg-primary { background-color: var(--mrd-primary) !important; }
.navbar .nav-link { opacity: .9; }
.navbar .nav-link:hover { opacity: 1; transform: translateY(-1px); }

/* Cards */
.card { border: 1px solid var(--mrd-border); border-radius: 14px; background: var(--mrd-card); box-shadow: var(--shadow-soft); }
.card .card-header { background: var(--mrd-light); border-bottom: 1px solid var(--mrd-border); }
.card-stats { color: #fff; box-shadow: var(--shadow-soft); }
.card-stats:hover { transform: translateY(-3px); box-shadow: var(--shadow-hover); }

/* Alerts and badges */
.alert { border: none; border-radius: 12px; box-shadow: var(--shadow-soft); }
.alert-success { background: #eef2ee; border: 1px solid var(--mrd-border); color: var(--mrd-dark); box-shadow: inset 4px 0 0 var(--mrd-success), var(--shadow-soft); }
.alert-danger  { background: #f3ecec; border: 1px solid var(--mrd-border); color: var(--mrd-dark); box-shadow: inset 4px 0 0 var(--mrd-danger), var(--shadow-soft); }
.alert-warning { background: #f3efe5; border: 1px solid var(--mrd-border); color: var(--mrd-dark); box-shadow: inset 4px 0 0 var(--mrd-warning), var(--shadow-soft); }
.alert-info    { background: #edf1f5; border: 1px solid var(--mrd-border); color: var(--mrd-dark); box-shadow: inset 4px 0 0 var(--mrd-info), var(--shadow-soft); }
.badge { border-radius: 10px; }

/* Tables */
.table thead th { border-bottom-color: var(--mrd-border); }
.table td, .table th { border-top-color: var(--mrd-border); }
.table-striped > tbody > tr:nth-of-type(odd) { background-color: #f3f2ef; }

/* Forms */
.form-control { border-radius: 10px; border-color: var(--mrd-border); background: #fff; }
.form-control:focus { border-color: var(--mrd-primary); box-shadow: 0 0 0 .2rem rgba(111,138,142,.15); }

/* Dropdowns */
.dropdown-menu { border: 1px solid var(--mrd-border); border-radius: 12px; box-shadow: var(--shadow-soft); }
.dropdown-item.active, .dropdown-item:active { background-color: var(--mrd-primary); }

/* Light background utility */
.bg-light { background-color: var(--mrd-light) !important; }

/* Footer */
footer.bg-light { background: var(--mrd-light) !important; border-top: 1px solid var(--mrd-border); }

/* Note: avoid page-level opacity/transform on containers to ensure Bootstrap modals render correctly above backdrops. */

/* Login page enhancements (non-invasive; overrides inline if present) */
body.login-page {
  background: linear-gradient(135deg, #c8d2d6 0%, #d9d2c8 100%) !important;
}
.login-container { box-shadow: var(--shadow-soft) !important; }
.btn-login { background: var(--mrd-primary) !important; }
.btn-login:hover { filter: brightness(1.05); transform: translateY(-2px); box-shadow: var(--shadow-hover); }

/* Subtle hover for tables and rows where used */
.table-hover tbody tr:hover { background-color: #efeeea; }
/* Links inside tables (e.g., gift card associated account) */
.table a { color: var(--mrd-primary); text-decoration: none; }
.table a:hover { text-decoration: underline; color: var(--mrd-info); }

/* Utility */
.soft-shadow { box-shadow: var(--shadow-soft) !important; }
.elevate:hover { transform: translateY(-2px); box-shadow: var(--shadow-hover) !important; }

/* Legacy utility compatibility (from SB-Admin-like styles) */
.text-gray-800 { color: var(--mrd-dark) !important; }
.text-gray-300 { color: #b9b9b9 !important; }
.border-left-primary { border-left: .25rem solid var(--mrd-primary) !important; }
.border-left-success { border-left: .25rem solid var(--mrd-success) !important; }
.border-left-danger  { border-left: .25rem solid var(--mrd-danger) !important; }

/* Outline buttons tuned to Morandi */
.btn-outline-secondary { color: var(--mrd-secondary) !important; border-color: var(--mrd-secondary) !important; }
.btn-outline-secondary:hover { background: var(--mrd-secondary) !important; color: #fff !important; }
.btn-outline-success { color: var(--mrd-success) !important; border-color: var(--mrd-success) !important; }
.btn-outline-success:hover { background: var(--mrd-success) !important; color: #fff !important; }
.btn-outline-info { color: var(--mrd-info) !important; border-color: var(--mrd-info) !important; }
.btn-outline-info:hover { background: var(--mrd-info) !important; color: #fff !important; }
.btn-outline-danger { color: var(--mrd-danger) !important; border-color: var(--mrd-danger) !important; }
.btn-outline-danger:hover { background: var(--mrd-danger) !important; color: #fff !important; }

/* yuyuwechat controls */
#yywTestBtn {
  color: var(--mrd-info) !important;
  border-color: var(--mrd-info) !important;
}
#yywTestBtn:hover { background: var(--mrd-info) !important; color: #fff !important; }

/* form switch primary color */
.form-check-input:checked {
  background-color: var(--mrd-primary) !important;
  border-color: var(--mrd-primary) !important;
}

/* Preview area action links as subtle buttons */
.edit-yyw-refresh-link, .edit-yyw-test-link {
  display: inline-block;
  padding: .15rem .5rem;
  border-radius: .5rem;
  border: 1px solid transparent;
  text-decoration: none !important;
  line-height: 1.2;
}
.edit-yyw-refresh-link {
  color: var(--mrd-info) !important;
  border-color: var(--mrd-info) !important;
}
.edit-yyw-refresh-link:hover { background: var(--mrd-info) !important; color: #fff !important; }
.edit-yyw-test-link {
  color: var(--mrd-success) !important;
  border-color: var(--mrd-success) !important;
}
.edit-yyw-test-link:hover { background: var(--mrd-success) !important; color: #fff !important; }

/* Breadcrumb links (e.g., 备份管理 -> 首页) */
.breadcrumb .breadcrumb-item a { color: var(--mrd-primary); text-decoration: none; }
.breadcrumb .breadcrumb-item a:hover { color: var(--mrd-info); text-decoration: underline; }

/* Pagination (备份管理翻页) */
.pagination .page-link {
  color: var(--mrd-dark);
  border: 1px solid var(--mrd-border);
  background: #fff;
}
.pagination .page-link:hover { background: var(--mrd-light); color: var(--mrd-primary); }
.pagination .page-item.active .page-link {
  color: #fff;
  background-color: var(--mrd-primary);
  border-color: var(--mrd-primary);
}
.pagination .page-item.disabled .page-link { color: #aaaaaa; background: #f6f6f6; }
