/* ===============================
   TidyWorks – Global Styles
   =============================== */

:root{
  --tw-primary: #2563eb;         /* blue-600 */
  --tw-primary-hover: #1e40af;   /* blue-800 */
  --tw-primary-100:#eef2ff;
  --tw-border: #e5e7eb;           /* gray-200 */
  --tw-muted:  #64748b;           /* slate-500 (readable) */
  --tw-text:   #0f172a;           /* slate-900 */
  --tw-bg:     #f7f9fc;           /* light section bg */
  --tw-success:#16a34a;           /* green-600 */
  --tw-danger: #dc2626;           /* red-600 */
  --tw-warning:#f59e0b;           /* amber-500 */
}

/* Base */
html, body {
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Noto Sans",
               "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
  color: var(--tw-text);
  background: #fff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* --- FOOTER FIX: FLEXBOX LAYOUT --- */
body { display:flex; flex-direction:column; min-height:100vh; }
main { flex-grow:1; }
/* --- END FOOTER FIX --- */

/* Section wrapper */
.page-section{background:#fff; padding:2rem 0}
.section-header{display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:1rem}
.section-title{font-weight:700}

/* ---------- Readability boosts ---------- */
.text-muted, .text-secondary, small, .small { color: var(--tw-muted) !important; }

/* Nav tabs should never look faded */
.nav-tabs .nav-link {
  color:#334155;                 /* slate-700 */
  opacity:1 !important;          /* kill opacity fade */
  font-weight:500;
}
.nav-tabs .nav-link:hover { color:#0f172a; }
.nav-tabs .nav-link.active {
  color:#0f172a !important;
  font-weight:700;
}

/* Links */
a, .link-primary { color:#0b5ed7; }

/* ---------- Buttons ---------- */
.btn-tw{
  background:var(--tw-primary);
  border-color:var(--tw-primary);
  color:#fff;
}
.btn-tw:hover{background:var(--tw-primary-hover); border-color:var(--tw-primary-hover); color:#fff}

.btn-light-outline{
  background:#fff;
  color:var(--tw-text);
  border:1px solid var(--tw-border);
}
.btn-light-outline:hover{background:#f3f4f6}

.btn-outline-primary{
  --bs-btn-color:var(--tw-primary);
  --bs-btn-border-color:var(--tw-primary);
}
.btn-outline-primary:hover{background:var(--tw-primary); border-color:var(--tw-primary)}

/* Keep action buttons from changing size when submitting */
.tw-card-actions .btn{ min-width:148px; padding:.625rem 1rem; }
.tw-card-actions .btn i{ margin-right:.35rem; }

/* Make modal primary/secondary actions same width */
.modal .btn{ min-width:120px; }

/* ---------- Badges ---------- */
.badge-warning{ background:var(--tw-warning); color:#1f2937; }
.badge-success{ background:var(--tw-success); }
.badge-danger { background:var(--tw-danger); }

/* ---------- Cards / Lists ---------- */
.tw-card{
  border:1px solid var(--tw-border);
  border-radius:14px;
  background:#fff;
  box-shadow:0 6px 20px rgba(0,0,0,.05);
  color:inherit;
}
.tw-card .card-body{ padding:1.25rem; }
.tw-card .card-footer{ background:#fff; border-top:0; padding:0 1.25rem 1.25rem; }

/* Provider Dashboard cards (extra breathing room) */
.provider-card{ border-radius:14px; overflow:hidden; }
.provider-card .card-body{ padding:1.25rem 1.25rem .5rem; }
.provider-card .card-footer{ padding:0 1.25rem 1.25rem; }

/* ---------- Receipt ---------- */
.receipt-modal .modal-content{
  border-radius:16px;
  border:1px solid var(--tw-border);
  overflow:hidden;
}
.receipt-header{
  background:var(--tw-primary-100);
  padding:1rem 1.25rem;
  border-bottom:1px solid var(--tw-border);
  display:flex; align-items:center; justify-content:space-between;
}
.receipt-brand{ display:flex; align-items:center; gap:.75rem; }
.receipt-brand .logo{
  display:inline-flex; width:32px; height:32px; border-radius:8px;
  background:var(--tw-primary); color:#fff; align-items:center; justify-content:center;
  font-weight:700;
}
.receipt-badge{
  background:#0f172a; color:#fff; border-radius:12px;
  padding:.2rem .65rem; font-weight:600; font-size:.9rem;
}
.receipt-grid .field{ border:1px solid var(--tw-border); border-radius:12px; padding:14px; background:#fff; }
.receipt-label{ font-size:.75rem; letter-spacing:.06em; color:#6b7280; text-transform:uppercase; }
.receipt-watermark{ text-align:center; color:#e5e7eb; font-weight:800; letter-spacing:.15em; }
.receipt-oneline{ white-space:nowrap; }

/* ---------- Toasts ---------- */
.toast-container{ z-index:1080; }
.toast .toast-header strong{ font-weight:700; }
.text-bg-success .toast-header{ background:rgba(16,185,129,.1); }
.text-bg-danger  .toast-header{ background:rgba(239,68,68,.1); }
.text-bg-info    .toast-header{ background:rgba(59,130,246,.1); }
.text-bg-warning .toast-header{ background:rgba(245,158,11,.12); }

/* ---------- Logout / warning modal icon ---------- */
.modal-warning .warn-circle{
  width:52px; height:52px; border-radius:50%;
  background:rgba(245,158,11,.15); color:#d97706;
  display:flex; align-items:center; justify-content:center; margin:0 auto .5rem;
  font-size:1.5rem;
}

/* ---------- Header (gradient + light nav) ---------- */
.site-header {
  background: linear-gradient(135deg,#2563eb,#7c3aed); /* blue → purple */
}
.site-header .navbar-brand,
.site-header .nav-link { color:#eef2ff !important; }
.site-header .nav-link:hover { color:#ffffff !important; }

/* ensure toggler icon visible on gradient */
.navbar-dark .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='rgba(255,255,255,0.95)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3e%3c/svg%3e");
}

/* ---------- Header tweaks ---------- */
.header-nav-end{ margin-left:auto; }

/* ---------- Utilities ---------- */
.text-muted-500{ color:var(--tw-muted)!important; }
.border-soft{ border-color:var(--tw-border)!important; }
.bg-soft{ background:var(--tw-bg)!important; }
.ratio-16x9>img{ object-fit:cover; }

/* ---------- Responsive spacing for card grids ---------- */
@media (min-width: 992px){
  .gy-lg-4{ row-gap:1.5rem; }
}

/* =======================================================
   INDEX (Home) — dedicated styles for homepage changes
   ======================================================= */

/* Divider between Available Services and Reviews & Feedback */
.section-divider{
  height:1px;
  background: linear-gradient(90deg, rgba(0,0,0,0), var(--tw-border), rgba(0,0,0,0));
  margin: 2.75rem 0;
  border:0;
}

/* Reviews & Feedback section wrapper */
.clients-say{
  background: linear-gradient(180deg, #f8fafc, #ffffff);
  border-top: 1px solid #eef2f7;
  border-bottom: 1px solid #eef2f7;
  padding: 3rem 0;
  border-radius: 24px;
}

/* Review cards */
.review-card{
  border: none;
  border-radius: 20px;
  box-shadow: 0 6px 20px rgba(0,0,0,.06);
  height: 100%;
}
.review-card .badge-rating{
  background-color: #102a4b;
  color: #fff;
  border-radius: 10px;
  padding: .2rem .5rem;
  font-weight: 600;
}
.review-quote{
  font-size: 0.98rem;
  line-height: 1.6;
}

/* Review carousel-like controls (Back / Next) */
.review-controls{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:.5rem;
}
.review-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.35rem;
  border:1px solid var(--tw-border);
  background:#fff;
  color:#0f172a;
  border-radius:12px;
  padding:.4rem .7rem;
  font-weight:600;
  line-height:1;
  box-shadow: 0 2px 8px rgba(0,0,0,.04);
  transition: background .15s ease, border-color .15s ease, transform .06s ease;
  user-select:none;
}
.review-btn:active{ transform: translateY(1px); }
.review-btn:hover{
  background: var(--tw-primary-100);
  border-color: var(--tw-primary);
  color: var(--tw-primary);
}
.review-btn i{
  font-style:normal; /* using ‹ and › characters */
  font-size:1rem;
  line-height:1;
}