﻿/* Button system tokens and unified interactions */
:root{
  --btn-radius: 14px;
  --btn-lift-y: -2px;
  --btn-shadow-rest: 0 8px 20px rgba(18,48,71,.10);
  --btn-shadow-hover: 0 14px 30px rgba(18,48,71,.16);
  --btn-shadow-active: 0 6px 14px rgba(18,48,71,.12);
}

.btn,
.contact-btn,
.filter-btn,
.tabs-tab,
.tabs-arrow,
.tabs-rail-btn,
.sort-dd-btn,
.sort-dd-item,
.burger{
  border-radius: var(--btn-radius);
  transition: transform .14s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease, color .18s ease;
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border: 1px solid #cfe0ec;
  background: linear-gradient(180deg, #ffffff, #f3f8fc);
  color: #163042;
  box-shadow: var(--btn-shadow-rest);
}

.btn:hover{
  transform: translateY(var(--btn-lift-y));
  border-color: #b9d1e2;
  box-shadow: var(--btn-shadow-hover);
}

.btn:active{
  transform: translateY(0) scale(.98);
  box-shadow: var(--btn-shadow-active);
}

.btn.primary{
  color:#ffffff;
  border-color: rgba(14,165,164,.32);
  background: linear-gradient(135deg, #0ea5a4 0%, #3b82f6 100%);
  box-shadow: 0 10px 24px rgba(24,98,165,.22);
}

.btn.ghost{
  background: #f7fbff;
  border-color: #d2e2ee;
  color: #163042;
}

.btn:focus-visible,
.contact-btn:focus-visible,
.filter-btn:focus-visible,
.tabs-tab:focus-visible,
.tabs-arrow:focus-visible,
.tabs-rail-btn:focus-visible,
.sort-dd-btn:focus-visible,
.sort-dd-item:focus-visible,
.burger:focus-visible{
  outline: 2px solid rgba(45,212,191,.86);
  outline-offset: 3px;
}

/* Providers "Show more" button kept as a dedicated variant */
body[data-page="home"] section#providers .providers-more .providers-more-btn{
  min-height: 40px;
  padding: 9px 20px;
  border-radius: var(--btn-radius);
  border: 1px solid rgba(196, 211, 223, .86);
  background: linear-gradient(180deg, #f3f8fc 0%, #e8f0f6 100%);
  color: #243746 !important;
  font-weight: 700 !important;
  box-shadow: 0 8px 18px rgba(47, 77, 100, .12);
}

@media (hover:hover){
  body[data-page="home"] section#providers .providers-more .providers-more-btn:hover{
    transform: translateY(var(--btn-lift-y));
    border-color: rgba(177, 197, 212, .94);
    background: linear-gradient(180deg, #f8fbfe 0%, #edf4f9 100%);
    color: #1f3241 !important;
    box-shadow: 0 12px 24px rgba(47, 77, 100, .18);
  }
}

body[data-page="home"] section#providers .providers-more .providers-more-btn:active{
  transform: translateY(0) scale(.98);
  box-shadow: 0 6px 14px rgba(47, 77, 100, .14);
}
