:root{
  --pink:#d95b73;
  --pink-dark:#bf435c;
  --pink-light:#fff2f5;
  --pink-soft:#f9dde4;
  --rose:#ead0d5;
  --text:#2e292a;
  --muted:#7f7374;
  --line:#eadadd;
  --bg:#fffafa;
  --white:#ffffff;
  --shadow:0 14px 34px rgba(119, 59, 72, .10);
  --shadow-sm:0 7px 20px rgba(124, 71, 83, .09);
  --radius-xl:26px;
  --radius-lg:18px;
  --radius-md:14px;
  --container:1320px;
}

*{box-sizing:border-box}

html{
  scroll-behavior:smooth;
}

body{
  margin:0;
  font-family:"IRANSans","IRANSansX","IRANSansXFaNum",Tahoma,Arial,sans-serif;
  color:var(--text);
  background:#fff;
  direction:rtl;
  text-rendering:optimizeLegibility;
}

a{color:inherit;text-decoration:none}
button,input,select{font:inherit}
button{cursor:pointer}
img{display:block;max-width:100%}

.svg-sprite{
  position:absolute;
  width:0;
  height:0;
  overflow:hidden;
}

svg{
  width:20px;
  height:20px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.85;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.container{
  width:min(var(--container), calc(100% - 76px));
  margin-inline:auto;
}

.site-header{
  background:rgba(255,255,255,.97);
  border-bottom:1px solid #efe2e5;
  position:relative;
  z-index:10;
}

.header-inner{
  height:82px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
}

.brand{
  min-width:162px;
  display:grid;
  grid-template-columns:auto 1fr;
  grid-template-rows:auto auto;
  align-items:center;
  column-gap:8px;
  color:var(--pink);
}

.brand-mark{
  grid-row:1/3;
  width:45px;
  height:45px;
  display:grid;
  place-items:center;
}

.brand-mark svg{
  width:45px;
  height:45px;
  stroke:var(--pink);
  stroke-width:2.1;
}

.brand-text{
  font-size:34px;
  font-weight:800;
  line-height:1;
  letter-spacing:-1.5px;
}

.brand small{
  color:#8d8082;
  font-size:10px;
  font-weight:600;
  margin-top:5px;
  white-space:nowrap;
}

.main-nav{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:29px;
  flex:1;
}

.main-nav a{
  color:#3f393a;
  font-weight:700;
  font-size:14px;
  line-height:1;
  transition:.2s ease;
}

.main-nav a:hover,
.main-nav a:first-child{
  color:var(--pink);
}

.header-actions{
  display:flex;
  align-items:center;
  gap:10px;
  direction:ltr;
}

.btn{
  min-height:42px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:0 19px;
  font-weight:800;
  font-size:14px;
  line-height:1;
  border:1px solid transparent;
  transition:.22s ease;
  white-space:nowrap;
}

.btn svg{width:19px;height:19px}

.btn-primary{
  color:#fff;
  background:linear-gradient(180deg, #df647b 0%, #ce4f67 100%);
  box-shadow:0 11px 22px rgba(217,91,115,.22);
}

.btn-primary:hover{
  transform:translateY(-1px);
  box-shadow:0 16px 28px rgba(217,91,115,.28);
}

.btn-outline{
  background:#fff;
  border-color:#ead6da;
  color:#2c2526;
  box-shadow:0 4px 12px rgba(88,47,56,.05);
}

.btn-soft{
  background:#fff;
  border-color:#efdde1;
  color:#2c2526;
}

.mobile-menu-btn{
  display:none;
  width:43px;
  height:43px;
  border:1px solid #ecd9de;
  border-radius:14px;
  background:#fff;
  color:var(--pink);
  padding:10px;
}

.mobile-menu-btn span{
  display:block;
  height:2px;
  background:var(--pink);
  border-radius:2px;
  margin:5px 0;
}

.mobile-panel{
  display:none;
  border-top:1px solid #f1e1e5;
  padding:12px 28px 18px;
  background:#fff;
}

.mobile-panel a{
  display:block;
  padding:11px 4px;
  color:#3f393a;
  font-weight:700;
  border-bottom:1px solid #f7eef0;
}

/* Hero */
.hero{
  min-height:365px;
  position:relative;
  overflow:hidden;
  background:#fbefef;
  border-bottom:1px solid #eedcde;
}

.hero-bg{
  position:absolute;
  inset:0 auto 0 0;
  width:55%;
  height:100%;
  object-fit:cover;
  object-position:left center;
}

.hero-gradient{
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, rgba(251,238,238,.05) 0%, rgba(251,238,238,.45) 35%, rgba(251,238,238,.93) 56%, #fbefef 100%),
    radial-gradient(circle at 76% 44%, rgba(255,255,255,.78), rgba(255,255,255,0) 42%);
}

.hero-inner{
  position:relative;
  z-index:1;
  min-height:365px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  padding:33px 0 18px;
}

.hero-content{
  width:52%;
  margin-right:auto;
  text-align:right;
  padding-top:2px;
}

.hero h1{
  margin:0 0 14px;
  font-size:52px;
  line-height:1.15;
  font-weight:900;
  letter-spacing:-1px;
  color:#2b2728;
}

.hero p{
  margin:0 0 31px;
  color:#6c6062;
  font-size:17px;
  font-weight:700;
}

.search-card{
  width:min(1148px, 100%);
  min-height:86px;
  background:rgba(255,255,255,.87);
  border:1px solid #efd4da;
  box-shadow:0 20px 45px rgba(116,61,73,.13);
  backdrop-filter:blur(14px);
  border-radius:24px;
  display:grid;
  grid-template-columns:1.55fr 1fr 1.15fr 1fr 176px;
  gap:16px;
  padding:19px;
  align-items:center;
  margin:0 auto;
}

.search-field{
  min-height:52px;
  display:grid;
  align-content:center;
  gap:4px;
  position:relative;
  background:#fff;
  border:1px solid #ecdde0;
  border-radius:13px;
  padding:8px 16px;
}

.search-field span{
  color:#84777a;
  font-size:11px;
  font-weight:800;
}

.search-field input,
.search-field select{
  width:100%;
  border:0;
  outline:0;
  background:transparent;
  color:#2c2829;
  font-size:13px;
  font-weight:800;
  padding:0;
  appearance:none;
}

.search-field select{
  background-image:linear-gradient(45deg, transparent 50%, #b17a83 50%),linear-gradient(135deg, #b17a83 50%, transparent 50%);
  background-position:13px 9px, 7px 9px;
  background-size:6px 6px, 6px 6px;
  background-repeat:no-repeat;
  padding-left:22px;
}

.search-keyword{
  grid-template-columns:1fr auto;
  align-items:center;
}

.search-keyword span,
.search-keyword input{
  grid-column:1;
}

.search-keyword svg{
  grid-row:1/3;
  grid-column:2;
  color:var(--pink);
  width:24px;
  height:24px;
}

.search-submit{
  min-height:56px;
  border:0;
  border-radius:13px;
  flex-direction:row-reverse;
  font-size:17px;
}

.quick-actions{
  min-width:min(884px,100%);
  margin:14px auto 0;
  background:rgba(255,255,255,.86);
  border:1px solid #efdde0;
  box-shadow:0 10px 24px rgba(115,61,72,.08);
  border-radius:999px;
  display:grid;
  grid-template-columns:repeat(6,1fr);
  overflow:hidden;
}

.quick-actions a{
  min-height:46px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  color:#6e5d60;
  font-size:13px;
  font-weight:800;
  border-left:1px solid #efdee2;
  transition:.2s ease;
}

.quick-actions a:first-child{border-left:0}

.quick-actions a svg{
  color:var(--pink);
  width:19px;
  height:19px;
}

.quick-actions a:hover{
  background:#fff5f7;
  color:var(--pink);
}

/* Sections */
.section-gap{
  padding:18px 0 0;
}

.section-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  margin:0 0 20px;
  min-height:38px;
}

.section-head > div{
  position:relative;
  padding-right:22px;
}

.section-head > div::before{
  content:"";
  position:absolute;
  right:0;
  top:5px;
  width:12px;
  height:23px;
  border-radius:0 14px 14px 0;
  background:linear-gradient(180deg,#f4b9c2,#e07a8d);
  opacity:.85;
}

.section-head h2{
  margin:0 0 7px;
  font-size:22px;
  font-weight:900;
  color:#2d292a;
}

.section-head p{
  margin:0;
  color:#7d7173;
  font-size:13px;
  font-weight:700;
}

.show-all{
  min-width:126px;
  height:36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid #f0dfe3;
  color:var(--pink);
  background:#fff;
  border-radius:11px;
  font-size:13px;
  font-weight:800;
  box-shadow:0 6px 13px rgba(119,59,72,.05);
}

/* Categories */
.categories{
  padding-top:21px;
}

.category-grid{
  display:grid;
  grid-template-columns:repeat(10,1fr);
  gap:15px;
}

.category-card{
  min-height:104px;
  background:#fff;
  border:1px solid #efdde0;
  border-radius:14px;
  box-shadow:var(--shadow-sm);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:10px;
  color:#bd5b66;
  transition:.2s ease;
}

.category-card svg{
  width:45px;
  height:45px;
  stroke-width:1.45;
}

.category-card span{
  font-size:13px;
  font-weight:900;
  color:#9c4d56;
}

.category-card:hover{
  transform:translateY(-3px);
  border-color:#e5b9c1;
  box-shadow:0 18px 30px rgba(119,59,72,.12);
}

/* Cards */
.cards-wrap,
.small-slider-wrap{
  position:relative;
}

.salon-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:23px;
}

.salon-card{
  background:#fff;
  border:1px solid #ecdde0;
  border-radius:14px;
  box-shadow:var(--shadow-sm);
  overflow:hidden;
}

.salon-media{
  height:132px;
  position:relative;
  overflow:hidden;
}

.salon-media img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.heart-btn{
  position:absolute;
  left:14px;
  top:12px;
  width:39px;
  height:39px;
  border:0;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#6d5d60;
  background:#fff;
  box-shadow:0 7px 17px rgba(0,0,0,.12);
}

.heart-btn svg{
  width:22px;
  height:22px;
  stroke-width:1.9;
}

.heart-btn.is-active{
  color:#fff;
  background:var(--pink);
}

.badge{
  position:absolute;
  right:10px;
  top:10px;
  min-width:44px;
  height:24px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  background:var(--pink);
  font-size:12px;
  font-weight:900;
}

.salon-body{
  padding:17px 16px 12px;
  text-align:center;
}

.salon-body h3{
  margin:0 0 12px;
  font-size:16px;
  font-weight:900;
}

.meta-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  color:#7b6f70;
  font-size:12px;
  font-weight:800;
}

.rating{
  color:#4b4244;
  direction:ltr;
  display:inline-flex;
  gap:4px;
  align-items:center;
}

.rating b{
  color:#f2b21b;
  font-size:12px;
  letter-spacing:1px;
}

.tag-row{
  margin:13px 0 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:7px;
}

.tag-row span{
  min-height:25px;
  border-radius:999px;
  background:#fbf0f2;
  color:#805f65;
  padding:6px 11px 5px;
  font-size:12px;
  font-weight:800;
}

.time{
  margin:0;
  color:#6a5e60;
  font-size:12px;
  font-weight:800;
}

.salon-actions{
  min-height:49px;
  display:grid;
  grid-template-columns:34px 34px 34px 34px 1fr;
  align-items:center;
  gap:4px;
  border-top:1px solid #f0e1e4;
  padding:8px 10px 10px;
  direction:ltr;
}

.salon-actions span{
  width:31px;
  height:31px;
  display:grid;
  place-items:center;
  color:#bd5965;
  border-radius:50%;
  background:#fff;
}

.salon-actions span svg{
  width:18px;
  height:18px;
  stroke-width:1.85;
}

.salon-actions a{
  justify-self:end;
  min-height:31px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 16px;
  color:#fff;
  background:var(--pink);
  border-radius:7px;
  font-size:12px;
  font-weight:900;
  box-shadow:0 8px 15px rgba(217,91,115,.22);
}

.slider-arrow{
  position:absolute;
  z-index:4;
  top:50%;
  transform:translateY(-50%);
  width:48px;
  height:48px;
  border:1px solid #f0e0e4;
  border-radius:50%;
  background:#fff;
  color:var(--pink);
  display:grid;
  place-items:center;
  box-shadow:0 9px 22px rgba(118,60,72,.12);
}

.slider-arrow svg{
  width:21px;
  height:21px;
}

.slider-prev{
  right:-27px;
}

.slider-next{
  left:-27px;
}

.slider-next svg{
  transform:rotate(180deg);
}

/* Map */
.map-banner{
  min-height:146px;
  border:1px solid #ecdde0;
  border-radius:14px;
  box-shadow:var(--shadow-sm);
  overflow:hidden;
  position:relative;
  background:#fff;
}

.map-banner img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}

.map-banner::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, rgba(255,255,255,.20), rgba(255,255,255,.92) 50%, #fff 100%);
}

.map-content{
  position:relative;
  z-index:1;
  min-height:146px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  padding:22px 62px 22px 20px;
  margin-right:auto;
  width:42%;
}

.map-content h2{
  margin:0 0 9px;
  font-size:24px;
  font-weight:900;
}

.map-content p{
  margin:0 0 19px;
  color:#6f6264;
  font-size:13px;
  font-weight:800;
}

/* Popular */
.popular-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:17px;
}

.popular-card{
  min-height:102px;
  background:#fff;
  border:1px solid #ecdde0;
  border-radius:14px;
  box-shadow:var(--shadow-sm);
  display:grid;
  grid-template-columns:83px 1fr;
  gap:13px;
  align-items:center;
  padding:9px;
}

.popular-card img{
  width:83px;
  height:83px;
  border-radius:11px;
  object-fit:cover;
}

.popular-card h3{
  margin:0 0 7px;
  font-size:14px;
  font-weight:900;
}

.mini-rating{
  color:#f0a900;
  font-size:12px;
  font-weight:900;
}

.popular-card p{
  margin:7px 0 0;
  color:#6c6062;
  font-size:12px;
  font-weight:800;
}

/* Discount */
.discount-banner{
  min-height:119px;
  position:relative;
  overflow:hidden;
  border-radius:16px;
  background:
    linear-gradient(90deg, rgba(255,255,255,0) 0, rgba(255,229,235,.72) 45%, rgba(255,241,244,.96) 100%),
    radial-gradient(circle at 18% 54%, rgba(255,255,255,.58), rgba(255,255,255,0) 30%),
    linear-gradient(135deg, #ffd9e1, #fff4f6);
  border:1px solid #f2dbe0;
  box-shadow:var(--shadow-sm);
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:18px 225px 18px 210px;
}

.discount-banner img{
  position:absolute;
  left:24px;
  top:50%;
  transform:translateY(-50%);
  width:295px;
  height:auto;
  object-fit:contain;
}

.discount-banner::before{
  content:"";
  position:absolute;
  right:30px;
  top:0;
  bottom:0;
  width:250px;
  background:
    radial-gradient(circle at 25% 60%, rgba(255,255,255,.75) 0 18px, transparent 19px),
    radial-gradient(circle at 72% 30%, rgba(255,255,255,.5) 0 12px, transparent 13px);
  opacity:.5;
}

.discount-text{
  position:relative;
  z-index:1;
}

.discount-text h2{
  margin:0 0 8px;
  color:#95535d;
  font-size:28px;
  font-weight:900;
}

.discount-text p{
  margin:0;
  color:#6d6062;
  font-size:14px;
  font-weight:800;
}

.discount-banner .btn{
  position:absolute;
  right:30px;
  z-index:1;
  min-width:147px;
}

/* Cities */
.city-grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:20px;
}

.city-card{
  background:#fff;
  border:1px solid #ecdde0;
  border-radius:12px;
  box-shadow:var(--shadow-sm);
  overflow:hidden;
  text-align:center;
  transition:.2s ease;
}

.city-card img{
  width:100%;
  height:96px;
  object-fit:cover;
}

.city-card h3{
  margin:14px 0 7px;
  font-size:17px;
  font-weight:900;
}

.city-card p{
  margin:0 0 15px;
  color:#75696b;
  font-size:12px;
  font-weight:800;
}

.city-card:hover{
  transform:translateY(-3px);
}

/* How */
.center-title{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:16px;
  margin:10px 0 15px;
}

.center-title span{
  width:86px;
  height:1px;
  background:linear-gradient(90deg, transparent, #cfa4ab, transparent);
}

.center-title h2{
  margin:0;
  font-size:24px;
  font-weight:900;
}

.how-box{
  border:1px solid #eac9cf;
  border-radius:18px;
  background:#fffafa;
  box-shadow:var(--shadow-sm);
  display:grid;
  grid-template-columns:repeat(6,1fr);
  overflow:hidden;
}

.how-box article{
  min-height:143px;
  padding:20px 18px;
  display:grid;
  grid-template-columns:58px 1fr;
  grid-template-areas:
    "icon title"
    "icon strong"
    "icon text";
  align-content:center;
  gap:5px 13px;
  border-left:1px solid #efd9de;
}

.how-box article:last-child{border-left:0}

.how-icon{
  grid-area:icon;
  width:58px;
  height:58px;
  border-radius:50%;
  background:#ffe7ec;
  color:var(--pink);
  display:grid;
  place-items:center;
  align-self:center;
}

.how-icon svg{
  width:31px;
  height:31px;
}

.how-box h3{
  grid-area:title;
  margin:0;
  font-size:13px;
  color:#75686a;
  font-weight:900;
}

.how-box strong{
  grid-area:strong;
  font-size:14px;
  font-weight:900;
  color:#2d2829;
}

.how-box p{
  grid-area:text;
  margin:0;
  color:#776a6c;
  font-size:12px;
  font-weight:700;
  line-height:1.8;
}

/* Promo */
.promo{
  padding-bottom:24px;
}

.promo-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:32px;
}

.promo-card{
  min-height:174px;
  border:1px solid #efd6dc;
  border-radius:18px;
  background:
    radial-gradient(circle at 18% 22%, rgba(255,255,255,.75), transparent 30%),
    linear-gradient(135deg,#ffd9e1,#fff8fa 72%);
  box-shadow:var(--shadow-sm);
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:20px 34px;
}

.promo-card h2{
  margin:0 0 12px;
  font-size:23px;
  font-weight:900;
}

.promo-card p{
  margin:0 0 20px;
  color:#6c6062;
  font-size:14px;
  font-weight:800;
}

.app-card img{
  width:190px;
  height:132px;
  object-fit:contain;
  align-self:flex-end;
}

.store-buttons{
  display:flex;
  gap:10px;
}

.store-buttons a{
  min-width:122px;
  height:42px;
  border-radius:8px;
  background:#151515;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:800;
  font-size:13px;
}

.newsletter-card{
  background:
    radial-gradient(circle at 83% 32%, rgba(255,255,255,.8), transparent 32%),
    linear-gradient(135deg,#fff8fa,#ffdfe6);
}

.newsletter-card img{
  width:200px;
  height:130px;
  object-fit:contain;
  margin-left:-12px;
}

.newsletter-form{
  display:grid;
  grid-template-columns:1fr 107px;
  gap:10px;
  width:min(390px,100%);
  direction:ltr;
}

.newsletter-form input{
  min-height:44px;
  border:1px solid #efdde0;
  background:#fff;
  border-radius:10px;
  outline:0;
  padding:0 16px;
  text-align:right;
  direction:rtl;
  color:#52494a;
}

.newsletter-form .btn{
  min-height:44px;
  border:0;
  border-radius:10px;
}

/* Footer */
.site-footer{
  margin-top:0;
  border-top:1px solid #ecdee1;
  background:linear-gradient(180deg,#fff 0%,#fff8f9 100%);
  padding:44px 0 0;
}

.footer-grid{
  display:grid;
  grid-template-columns:1.55fr repeat(5, 1fr);
  gap:40px;
  align-items:start;
}

.footer-brand{
  text-align:right;
}

.footer-logo{
  margin-bottom:15px;
  width:max-content;
}

.footer-brand p{
  margin:0 0 18px;
  color:#6d6062;
  font-size:13px;
  line-height:1.9;
  font-weight:800;
}

.socials{
  display:flex;
  gap:10px;
  margin-bottom:20px;
}

.socials a{
  width:35px;
  height:35px;
  border:1px solid #edd7dc;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:var(--pink);
  background:#fff;
  font-size:14px;
  font-weight:900;
}

.trust-badges{
  display:flex;
  gap:12px;
}

.trust-badges img{
  width:63px;
  height:73px;
  border:1px solid #e6e0e1;
  border-radius:8px;
  object-fit:contain;
  background:#fff;
}

.footer-col h3{
  margin:0 0 17px;
  color:var(--pink);
  font-size:15px;
  font-weight:900;
}

.footer-col a,
.footer-col p{
  display:block;
  margin:0 0 13px;
  color:#675b5d;
  font-size:13px;
  font-weight:800;
}

.footer-col a:hover{
  color:var(--pink);
}

.contact-col p{
  display:flex;
  align-items:center;
  gap:10px;
}

.contact-col svg{
  width:18px;
  height:18px;
  color:var(--pink);
  flex:0 0 auto;
}

.copyright{
  margin-top:38px;
  border-top:1px solid #f0e3e5;
  text-align:center;
  color:#766a6c;
  padding:18px 20px 22px;
  font-size:12px;
  font-weight:800;
}

/* Responsive */
@media (max-width: 1240px){
  .container{width:min(var(--container), calc(100% - 42px))}
  .main-nav{gap:16px}
  .main-nav a{font-size:13px}
  .header-actions .btn-primary{display:none}
  .category-grid{grid-template-columns:repeat(5,1fr)}
  .how-box{grid-template-columns:repeat(3,1fr)}
  .how-box article:nth-child(3n){border-left:0}
  .footer-grid{grid-template-columns:1.4fr repeat(3,1fr);gap:30px}
}

@media (max-width: 1024px){
  .header-inner{height:72px}
  .main-nav{display:none}
  .mobile-menu-btn{display:block}
  .header-actions{margin-right:auto}
  .mobile-panel.is-open{display:block}
  .hero{min-height:auto}
  .hero-inner{min-height:420px;padding-top:42px;justify-content:center}
  .hero-content{width:60%}
  .hero h1{font-size:42px}
  .search-card{
    grid-template-columns:1fr 1fr;
    border-radius:20px;
  }
  .search-keyword,
  .search-submit{grid-column:span 2}
  .quick-actions{grid-template-columns:repeat(3,1fr);border-radius:18px}
  .quick-actions a{border-bottom:1px solid #efdee2}
  .salon-grid{grid-template-columns:repeat(2,1fr)}
  .popular-grid{grid-template-columns:repeat(2,1fr)}
  .city-grid{grid-template-columns:repeat(3,1fr)}
  .promo-grid{grid-template-columns:1fr}
  .map-content{width:56%}
  .discount-banner{padding-inline:170px}
  .discount-banner img{width:230px}
  .discount-banner .btn{right:20px}
}

@media (max-width: 760px){
  .container{width:min(var(--container), calc(100% - 26px))}
  .header-inner{
    height:auto;
    min-height:68px;
    gap:10px;
    flex-wrap:wrap;
    padding:11px 0;
  }
  .brand{min-width:auto}
  .brand-text{font-size:28px}
  .brand small{display:none}
  .brand-mark,
  .brand-mark svg{width:38px;height:38px}
  .header-actions{
    order:3;
    width:100%;
    direction:rtl;
    justify-content:space-between;
  }
  .header-actions .btn{
    flex:1;
    padding:0 8px;
    min-height:39px;
    font-size:12px;
  }
  .hero-bg{
    width:100%;
    opacity:.35;
  }
  .hero-gradient{
    background:linear-gradient(180deg, rgba(251,238,238,.94), rgba(251,238,238,.98));
  }
  .hero-inner{
    min-height:auto;
    padding:28px 0 20px;
  }
  .hero-content{
    width:100%;
    text-align:center;
  }
  .hero h1{
    font-size:32px;
    margin-bottom:10px;
  }
  .hero p{
    font-size:14px;
    margin-bottom:18px;
  }
  .search-card{
    grid-template-columns:1fr;
    padding:12px;
    gap:10px;
    border-radius:18px;
  }
  .search-keyword,
  .search-submit{grid-column:auto}
  .search-submit{min-height:50px}
  .quick-actions{
    grid-template-columns:repeat(2,1fr);
    width:100%;
    margin-top:12px;
  }
  .quick-actions a{
    min-height:42px;
    font-size:12px;
  }
  .category-grid{grid-template-columns:repeat(2,1fr);gap:11px}
  .category-card{min-height:92px}
  .section-head{
    align-items:center;
    margin-bottom:14px;
  }
  .section-head h2{font-size:19px}
  .show-all{min-width:94px;font-size:12px}
  .salon-grid,
  .popular-grid,
  .city-grid{
    display:flex;
    gap:14px;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    padding-bottom:10px;
    -webkit-overflow-scrolling:touch;
  }
  .salon-card{min-width:270px;scroll-snap-align:start}
  .popular-card{min-width:238px;scroll-snap-align:start}
  .city-card{min-width:180px;scroll-snap-align:start}
  .slider-arrow{display:none}
  .map-banner::after{background:linear-gradient(180deg, rgba(255,255,255,.55), #fff)}
  .map-content{
    width:100%;
    padding:24px;
    align-items:center;
    text-align:center;
  }
  .discount-banner{
    min-height:170px;
    padding:22px 18px 78px;
    flex-direction:column;
  }
  .discount-banner img{
    left:50%;
    transform:translateX(-50%);
    bottom:-8px;
    top:auto;
    width:220px;
    opacity:.85;
  }
  .discount-banner .btn{
    position:relative;
    right:auto;
    margin-top:16px;
  }
  .discount-text h2{font-size:22px}
  .how-box{grid-template-columns:1fr}
  .how-box article{
    border-left:0;
    border-bottom:1px solid #efd9de;
  }
  .how-box article:last-child{border-bottom:0}
  .center-title h2{font-size:21px}
  .center-title span{width:46px}
  .promo-card{
    padding:18px;
    min-height:auto;
    flex-direction:column;
    text-align:center;
    gap:12px;
  }
  .app-card img,
  .newsletter-card img{
    margin:0;
    order:-1;
  }
  .store-buttons{
    justify-content:center;
    flex-wrap:wrap;
  }
  .newsletter-form{
    grid-template-columns:1fr;
  }
  .footer-grid{
    grid-template-columns:1fr 1fr;
    gap:24px;
  }
  .footer-brand{
    grid-column:1/-1;
  }
}

@media (max-width: 480px){
  .footer-grid{grid-template-columns:1fr}
  .salon-card{min-width:245px}
  .popular-card{min-width:220px}
  .meta-row{flex-direction:column}
  .salon-actions{
    grid-template-columns:30px 30px 30px 30px 1fr;
    padding-inline:7px;
  }
  .salon-actions a{padding-inline:10px}
}

/* Empty image slots
   Replace each .image-slot with the matching <img> later by using the data-image path in HTML. */
.image-slot{
  display:block;
  background:#fff8fa;
  border:1px dashed #efd9de;
}

.hero-bg.image-slot{
  border:0;
  border-left:1px solid #efd9de;
  background:linear-gradient(135deg, #fff8fa, #f7e6ea);
}

.salon-media .salon-image{
  width:100%;
  height:100%;
  border:0;
  background:#fff7f9;
}

.map-banner .map-image{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
  background:#fff8fa;
}

.popular-card .popular-image{
  width:83px;
  height:83px;
  border-radius:11px;
  background:#fff7f9;
}

.discount-banner .discount-image{
  position:absolute;
  left:24px;
  top:50%;
  transform:translateY(-50%);
  width:295px;
  height:76px;
  border:0;
  background:transparent;
}

.city-card .city-image{
  width:100%;
  height:96px;
  border:0;
  background:#fff7f9;
}

.app-card .app-image{
  width:190px;
  height:132px;
  border:0;
  background:transparent;
  align-self:flex-end;
}

.newsletter-card .newsletter-image{
  width:200px;
  height:130px;
  border:0;
  background:transparent;
  margin-left:-12px;
}

.trust-badges .trust-image{
  width:63px;
  height:73px;
  border:1px dashed #e6e0e1;
  border-radius:8px;
  background:#fff;
}

@media (max-width: 1024px){
  .discount-banner .discount-image{width:230px}
}

@media (max-width: 760px){
  .hero-bg.image-slot{width:100%; opacity:.35}
  .discount-banner .discount-image{
    left:50%;
    transform:translateX(-50%);
    bottom:-8px;
    top:auto;
    width:220px;
    opacity:.85;
  }
  .app-card .app-image,
  .newsletter-card .newsletter-image{
    margin:0;
    order:-1;
  }
}

/* Featured salons slider update */
.cards-wrap.featured-slider{
  isolation:isolate;
  padding-inline:2px;
}

.featured-slider .salon-grid{
  display:flex;
  grid-template-columns:none;
  gap:23px;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-behavior:smooth;
  scroll-snap-type:x mandatory;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
  padding:1px 1px 12px;
  direction:rtl;
}

.featured-slider .salon-grid::-webkit-scrollbar{display:none}

.featured-slider .salon-card{
  flex:0 0 calc((100% - 69px) / 4);
  min-width:0;
  scroll-snap-align:start;
}

.featured-slider .slider-arrow{
  display:grid;
  transition:background .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease;
}

.featured-slider .slider-arrow:hover{
  background:var(--pink);
  color:#fff;
  transform:translateY(-50%) scale(1.04);
  box-shadow:0 14px 28px rgba(217,91,115,.22);
}

.featured-slider .slider-arrow:active{
  transform:translateY(-50%) scale(.96);
}

.salon-actions .action-btn{
  width:31px;
  height:31px;
  display:grid;
  place-items:center;
  color:#bd5965;
  border:0;
  border-radius:50%;
  background:#fff;
  transition:background .2s ease, color .2s ease, transform .2s ease;
}

.salon-actions .action-btn svg{
  width:18px;
  height:18px;
  stroke-width:1.85;
}

.salon-actions .action-btn:hover,
.salon-actions .action-btn.is-active,
.heart-btn.is-active{
  color:#fff;
  background:var(--pink);
}

.salon-actions .action-btn:active,
.heart-btn:active,
.profile-link:active{
  transform:scale(.94);
}

.salon-actions .profile-link{
  justify-self:end;
  min-height:31px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 16px;
  color:#fff;
  background:var(--pink);
  border-radius:7px;
  font-size:12px;
  font-weight:900;
  box-shadow:0 8px 15px rgba(217,91,115,.22);
  transition:background .2s ease, transform .2s ease;
}

.salon-actions .profile-link:hover{background:var(--pink-dark)}

.site-toast{
  position:fixed;
  right:24px;
  bottom:24px;
  z-index:1000;
  min-width:220px;
  max-width:min(360px, calc(100% - 48px));
  padding:13px 18px;
  border-radius:999px;
  color:#fff;
  background:#2e292a;
  box-shadow:0 18px 38px rgba(46,41,42,.20);
  font-size:13px;
  font-weight:800;
  text-align:center;
  opacity:0;
  pointer-events:none;
  transform:translateY(14px);
  transition:opacity .22s ease, transform .22s ease;
}

.site-toast.is-visible{
  opacity:1;
  transform:translateY(0);
}

.image-slot::after{
  content:attr(data-image);
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:10px;
  color:#c47a86;
  font-size:11px;
  font-weight:700;
  line-height:1.6;
  text-align:center;
  direction:ltr;
  opacity:.7;
}

.hero-bg.image-slot::after,
.discount-banner .discount-image::after,
.app-card .app-image::after,
.newsletter-card .newsletter-image::after{
  font-size:12px;
}

@media (max-width: 1024px){
  .featured-slider .salon-card{
    flex-basis:calc((100% - 23px) / 2);
  }
}

@media (max-width: 760px){
  .featured-slider .salon-grid{
    gap:14px;
    padding-inline:0;
  }

  .featured-slider .salon-card{
    flex-basis:min(86%, 310px);
    min-width:min(86%, 310px);
  }

  .featured-slider .slider-arrow{
    width:40px;
    height:40px;
  }

  .featured-slider .slider-prev{right:-10px}
  .featured-slider .slider-next{left:-10px}
}

@media (max-width: 480px){
  .featured-slider .salon-card{
    flex-basis:min(88%, 285px);
    min-width:min(88%, 285px);
  }

  .salon-actions .profile-link{padding-inline:9px}

  .site-toast{
    right:14px;
    bottom:14px;
    max-width:calc(100% - 28px);
  }
}

/* Keep required image positions empty until real assets are provided. */
.image-slot::after{
  content:"";
  padding:0;
}

/* User dashboard page */
.dashboard-page{
  --container:1400px;
  --dash-line:#f0dfe3;
  --dash-pink:#df4f75;
  --dash-soft:#fff4f7;
  --dash-text:#2b2728;
  --dash-muted:#8c7e81;
  background:#fff;
}

.dashboard-page .container{
  width:min(var(--container), calc(100% - 54px));
}

.dashboard-header{
  border-bottom:1px solid #f0e4e7;
  box-shadow:0 8px 28px rgba(61,37,43,.035);
}

.dashboard-header-inner{
  height:76px;
  gap:22px;
}

.dashboard-brand{
  min-width:154px;
}

.dashboard-brand .brand-text{
  font-size:31px;
}

.dashboard-brand small{display:none}

.dashboard-main-nav{
  gap:42px;
  justify-content:flex-start;
  padding-inline:28px 0;
}

.dashboard-main-nav a{
  font-size:14px;
  color:#353033;
}

.dashboard-top-actions{
  display:flex;
  align-items:center;
  gap:12px;
  direction:ltr;
}

.icon-pill{
  position:relative;
  width:45px;
  height:45px;
  display:grid;
  place-items:center;
  border:1px solid #f0e2e6;
  border-radius:15px;
  color:var(--pink);
  background:#fff;
  box-shadow:0 6px 16px rgba(98,52,63,.045);
  transition:.22s ease;
}

.icon-pill:hover,
.icon-pill.is-active{
  color:#fff;
  background:var(--pink);
  border-color:var(--pink);
  transform:translateY(-1px);
}

.icon-pill svg{width:22px;height:22px}

.icon-pill.has-badge::after{
  content:attr(data-badge);
  position:absolute;
  top:-7px;
  right:-6px;
  min-width:20px;
  height:20px;
  display:grid;
  place-items:center;
  padding:0 5px;
  border-radius:999px;
  color:#fff;
  background:var(--pink);
  border:2px solid #fff;
  font-size:11px;
  font-weight:900;
}

.dashboard-business-btn{
  min-width:144px;
  border-radius:10px;
  min-height:45px;
}

.dashboard-main{
  padding:28px 0 34px;
  background:linear-gradient(180deg,#fff 0%,#fff 74%,#fff8fa 100%);
}

.dashboard-shell{
  display:grid;
  grid-template-columns:minmax(0,1fr) 282px;
  gap:24px;
  align-items:start;
}

.dashboard-content{
  min-width:0;
  display:grid;
  gap:22px;
}

.dashboard-sidebar{
  min-width:0;
  display:grid;
  gap:18px;
}

.dash-card{
  background:#fff;
  border:1px solid var(--dash-line);
  border-radius:17px;
  box-shadow:0 12px 35px rgba(139,69,84,.055);
}

.profile-card{
  padding:26px 22px 22px;
  text-align:center;
}

.profile-avatar-wrap{
  position:relative;
  width:132px;
  height:132px;
  margin:0 auto 16px;
}

.profile-avatar{
  width:132px;
  height:132px;
  border-radius:50%;
  background:linear-gradient(145deg,#fff2f5,#f7dce3);
  border:4px solid #fff;
  outline:3px solid #ef9caf;
  box-shadow:0 16px 33px rgba(198,83,110,.16);
}

.profile-social{
  position:absolute;
  right:8px;
  bottom:9px;
  width:32px;
  height:32px;
  border:2px solid #fff;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:var(--pink);
  color:#fff;
  font-size:15px;
  font-weight:900;
  line-height:1;
}

.profile-card h1{
  margin:0 0 8px;
  color:#332d2f;
  font-size:23px;
  font-weight:900;
}

.user-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:28px;
  padding:0 14px;
  border-radius:999px;
  color:var(--pink);
  background:#fff0f4;
  font-size:12px;
  font-weight:900;
}

.profile-card p{
  margin:15px 0 18px;
  color:#95878a;
  font-size:13px;
  font-weight:700;
}

.profile-progress{
  margin-bottom:18px;
}

.progress-caption{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:10px;
  color:#72676a;
  font-size:13px;
  font-weight:800;
}

.progress-caption strong{color:var(--pink)}

.progress-line{
  height:9px;
  border-radius:999px;
  background:#f8dfe6;
  overflow:hidden;
}

.progress-line span{
  height:100%;
  display:block;
  border-radius:999px;
  background:linear-gradient(90deg,#df4e75,#ee7b98);
}

.full-btn{width:100%}

.dashboard-menu{
  padding:10px 0;
  overflow:hidden;
}

.dashboard-menu a{
  position:relative;
  min-height:45px;
  display:flex;
  align-items:center;
  gap:13px;
  padding:0 22px;
  color:#655b5d;
  font-size:14px;
  font-weight:800;
  transition:.2s ease;
}

.dashboard-menu a svg{
  width:21px;
  height:21px;
  color:var(--pink);
}

.dashboard-menu a:hover,
.dashboard-menu a.is-active{
  color:var(--pink);
  background:linear-gradient(90deg,#fff3f6,#fff);
}

.dashboard-menu a.is-active::before{
  content:"";
  position:absolute;
  right:0;
  top:8px;
  bottom:8px;
  width:4px;
  border-radius:999px 0 0 999px;
  background:var(--pink);
}

.help-card{
  padding:26px 22px 24px;
  text-align:center;
  background:linear-gradient(145deg,#fff,#fff3f6);
}

.help-card > svg{
  width:66px;
  height:66px;
  margin:0 auto 14px;
  color:var(--pink);
  stroke-width:1.55;
}

.help-card h2{
  margin:0 0 10px;
  font-size:17px;
  font-weight:900;
}

.help-card p{
  margin:0 0 20px;
  color:#8a7e81;
  font-size:13px;
  line-height:1.9;
}

.stats-grid{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:18px;
}

.stat-card{
  position:relative;
  min-height:125px;
  padding:20px 18px 17px;
  overflow:hidden;
}

.stat-card span{
  display:block;
  margin-bottom:15px;
  color:#6e6265;
  font-size:13px;
  font-weight:900;
}

.stat-card strong{
  display:block;
  direction:ltr;
  text-align:right;
  color:#312c2e;
  font-size:26px;
  font-weight:900;
  letter-spacing:-.3px;
}

.stat-card small{
  color:#8c7f82;
  font-size:12px;
  font-weight:800;
}

.stat-card i{
  position:absolute;
  left:18px;
  bottom:20px;
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  color:var(--pink);
  background:#fff0f4;
  border-radius:50%;
  font-style:normal;
}

.stat-card i svg{width:24px;height:24px}

.dashboard-section{
  padding:19px 20px 22px;
}

.section-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:18px;
}

.compact-head h2,
.section-head h2{
  margin:0;
  color:#332e30;
  font-size:20px;
  font-weight:900;
}

.section-link{
  color:var(--pink);
  font-size:12px;
  font-weight:900;
}

.appointment-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}

.appointment-card{
  border:1px solid #f0e1e5;
  border-radius:16px;
  padding:14px;
  background:#fff;
  box-shadow:0 8px 22px rgba(91,54,62,.035);
}

.appointment-media{
  height:132px;
  border-radius:13px;
  background:linear-gradient(145deg,#fff4f7,#f7e2e8);
}

.appointment-body{
  position:relative;
  padding:13px 2px 10px;
}

.appointment-body h3{
  margin:0 0 7px;
  font-size:16px;
  font-weight:900;
}

.appointment-body p{
  margin:0 0 7px;
  color:#74696c;
  font-size:13px;
  font-weight:800;
}

.appointment-body time{
  display:block;
  color:#97898d;
  font-size:12px;
  font-weight:700;
}

.status-chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:26px;
  padding:0 12px;
  border-radius:999px;
  font-size:12px;
  font-weight:900;
  white-space:nowrap;
}

.appointment-body .status-chip{
  margin-top:10px;
}

.status-ok{
  color:#18a267;
  background:#e9fff4;
}

.status-wait{
  color:#de9b25;
  background:#fff6df;
}

.status-cancel{
  color:#e54d72;
  background:#fff0f4;
}

.appointment-actions{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:9px;
  padding-top:5px;
}

.small-btn,
.table-btn{
  min-height:37px;
  border:1px solid #f0dfe3;
  border-radius:9px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 12px;
  color:var(--pink);
  background:#fff;
  font-size:12px;
  font-weight:900;
  transition:.2s ease;
}

.small-btn:hover,
.table-btn:hover,
.small-btn.is-active{
  color:#fff;
  background:var(--pink);
  border-color:var(--pink);
}

.small-btn.ghost:hover{
  color:#fff;
  background:#292527;
  border-color:#292527;
}

.table-responsive{
  overflow-x:auto;
  scrollbar-width:thin;
}

.booking-table{
  width:100%;
  min-width:760px;
  border-collapse:separate;
  border-spacing:0;
  overflow:hidden;
  border-radius:14px;
}

.booking-table th,
.booking-table td{
  padding:15px 13px;
  text-align:right;
  border-bottom:1px solid #f2e4e7;
  color:#6d6265;
  font-size:13px;
  font-weight:800;
}

.booking-table th{
  color:#5d5356;
  background:#fff5f7;
  font-size:12px;
  font-weight:900;
}

.booking-table tbody tr:last-child td{border-bottom:0}

.table-btn{
  min-height:30px;
  border-radius:8px;
  padding:0 17px;
}

.dashboard-split{
  display:grid;
  gap:20px;
}

.two-one{
  grid-template-columns:minmax(0,2fr) minmax(270px,.92fr);
}

.equal-split{
  grid-template-columns:1.1fr 1fr;
}

.favorite-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
}

.mini-salon-card{
  position:relative;
  border:1px solid #f0e1e5;
  border-radius:15px;
  padding:10px;
  background:#fff;
  overflow:hidden;
}

.mini-cover{
  height:103px;
  border-radius:12px;
  background:linear-gradient(145deg,#fff5f8,#f8e2e7);
}

.heart-float{
  position:absolute;
  left:16px;
  top:84px;
  width:33px;
  height:33px;
  display:grid;
  place-items:center;
  border:1px solid #f1dce1;
  border-radius:50%;
  color:var(--pink);
  background:#fff;
  box-shadow:0 8px 16px rgba(90,49,58,.08);
}

.heart-float svg{width:18px;height:18px}

.heart-float.is-active{
  color:#fff;
  background:var(--pink);
}

.mini-salon-card h3{
  margin:13px 0 4px;
  font-size:14px;
  font-weight:900;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.mini-salon-card p{
  margin:0 0 8px;
  color:#83777a;
  font-size:12px;
  font-weight:700;
}

.mini-salon-card strong,
.compare-item span{
  display:inline-flex;
  align-items:center;
  gap:3px;
  color:#352f31;
  font-size:13px;
  font-weight:900;
}

.mini-salon-card strong svg,
.compare-item span svg{
  width:15px;
  height:15px;
  fill:#ffb528;
  stroke:#ffb528;
}

.mini-actions{
  display:grid;
  grid-template-columns:34px 1fr;
  gap:8px;
  margin-top:10px;
}

.remove-mini{
  width:34px;
  height:37px;
  border:1px solid #eadfe2;
  border-radius:9px;
  color:#403b3d;
  background:#fff;
  font-size:18px;
  line-height:1;
}

.remove-mini:hover{
  color:#fff;
  background:#2d292b;
  border-color:#2d292b;
}

.compare-box{
  position:relative;
  display:grid;
  grid-template-columns:1fr 50px 1fr;
  gap:12px;
  align-items:center;
  padding:6px 0 16px;
}

.compare-item{
  text-align:center;
}

.compare-image{
  height:101px;
  border-radius:13px;
  margin-bottom:10px;
  background:linear-gradient(145deg,#fff5f8,#f8e1e7);
}

.compare-item strong{
  display:block;
  margin-bottom:4px;
  color:#332d2f;
  font-size:14px;
  font-weight:900;
}

.vs-badge{
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  margin:auto;
  border:1px solid #f0bdc9;
  border-radius:50%;
  color:var(--pink);
  background:#fff5f8;
  font-weight:900;
}

.review-list{
  display:grid;
  gap:20px;
}

.review-item{
  position:relative;
  display:grid;
  grid-template-columns:84px 1fr 72px;
  gap:13px;
  align-items:start;
  border-bottom:1px solid #f2e4e7;
  padding-bottom:18px;
}

.review-item:last-child{border-bottom:0;padding-bottom:0}

.review-item .small-btn{
  grid-column:3;
  grid-row:1;
  min-height:34px;
}

.review-thumb{
  width:84px;
  height:70px;
  border-radius:12px;
  background:linear-gradient(145deg,#fff5f8,#f8e2e7);
}

.review-item h3{
  margin:0 0 4px;
  font-size:14px;
  font-weight:900;
}

.review-item span{
  color:#94878a;
  font-size:12px;
  font-weight:700;
}

.stars{
  margin:3px 0 7px;
  color:#ffb528;
  font-size:17px;
  letter-spacing:1px;
}

.review-item p{
  margin:0;
  color:#675d60;
  font-size:13px;
  line-height:1.9;
}

.wallet-card{
  position:relative;
  overflow:hidden;
}

.wallet-summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:114px;
  padding:22px;
  border-radius:16px;
  background:linear-gradient(135deg,#fff7f9,#ffe7ee);
}

.wallet-summary span{
  color:#7d7174;
  font-size:13px;
  font-weight:800;
}

.wallet-summary strong{
  display:block;
  margin:6px 0 2px;
  color:#2f292b;
  font-size:26px;
  font-weight:900;
}

.wallet-summary small{
  color:#8a7d81;
  font-size:12px;
  font-weight:800;
}

.wallet-summary svg{
  width:66px;
  height:66px;
  color:var(--pink);
}

.wallet-btn{
  margin-top:-20px;
  margin-right:22px;
  min-height:37px;
  border-radius:9px;
}

.transaction-list{
  display:grid;
  gap:10px;
  margin-top:18px;
}

.transaction-list div{
  display:grid;
  grid-template-columns:1fr auto auto;
  gap:12px;
  align-items:center;
  font-size:12px;
  font-weight:800;
}

.transaction-list span{color:#675d60}
.transaction-list time{color:#94878a}
.transaction-list strong{direction:ltr;white-space:nowrap}
.transaction-list .plus{color:#20a66c}
.transaction-list .minus{color:#e55d79}

.dashboard-triple{
  display:grid;
  grid-template-columns:1.02fr 1.32fr 1fr;
  gap:20px;
}

.alert-list{
  display:grid;
  gap:11px;
}

.alert-list article{
  display:grid;
  grid-template-columns:40px 1fr auto;
  gap:12px;
  align-items:center;
  padding:10px;
  border:1px solid #f2e3e7;
  border-radius:12px;
}

.alert-list i{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:10px;
  color:var(--pink);
  background:#fff3f6;
  font-style:normal;
}

.alert-list i svg{width:21px;height:21px}
.alert-list p{margin:0;color:#63595c;font-size:12px;font-weight:800;line-height:1.7}
.alert-list time{color:#9a8c90;font-size:11px;font-weight:800;white-space:nowrap}
.alert-list + .btn{margin-top:15px}

.offer-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}

.offer-card{
  border:1px solid #f0e1e5;
  border-radius:15px;
  padding:10px;
  text-align:center;
  background:#fff;
}

.offer-img{
  height:104px;
  border-radius:12px;
  background:linear-gradient(145deg,#fff5f8,#f8e2e7);
}

.offer-card h3{
  margin:12px 0 5px;
  font-size:14px;
  font-weight:900;
}

.offer-card p{
  margin:0 0 9px;
  color:#776b6e;
  font-size:12px;
  font-weight:700;
}

.offer-card span{
  display:inline-flex;
  padding:5px 10px;
  border-radius:999px;
  color:#12a66b;
  background:#eafff5;
  font-size:12px;
  font-weight:900;
}

.offer-card strong{
  display:block;
  margin:8px 0 10px;
  color:#776b6e;
  font-size:12px;
  font-weight:800;
}

.coupon-list{
  display:grid;
  gap:13px;
}

.coupon-list article{
  position:relative;
  min-height:88px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:13px 15px;
  border:1px dashed #ef8da2;
  border-radius:14px;
  background:#fff8fa;
  overflow:hidden;
}

.coupon-list article::before,
.coupon-list article::after{
  content:"";
  position:absolute;
  top:50%;
  width:15px;
  height:15px;
  border-radius:50%;
  background:#fff;
  border:1px dashed #ef8da2;
  transform:translateY(-50%);
}

.coupon-list article::before{right:-8px}
.coupon-list article::after{left:-8px}

.coupon-list strong{
  display:block;
  margin-bottom:5px;
  color:var(--pink);
  direction:ltr;
  text-align:right;
  font-size:14px;
  font-weight:900;
}

.coupon-list span{
  display:block;
  color:#473f41;
  font-size:13px;
  font-weight:900;
}

.coupon-list small{
  color:#95888b;
  font-size:11px;
  font-weight:800;
}

.coupon-list svg{
  width:34px;
  height:34px;
  color:var(--pink);
}

.bottom-split{
  grid-template-columns:1.33fr .82fr 1fr;
}

.account-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0;
  border:1px solid #f1e3e7;
  border-radius:14px;
  overflow:hidden;
}

.account-grid div{
  min-height:58px;
  padding:13px 15px;
  border-left:1px solid #f1e3e7;
  border-bottom:1px solid #f1e3e7;
}

.account-grid div:nth-child(3n){border-left:0}
.account-grid div:nth-last-child(-n+3){border-bottom:0}

.account-grid span{
  display:block;
  margin-bottom:5px;
  color:#928589;
  font-size:12px;
  font-weight:800;
}

.account-grid strong{
  color:#3b3537;
  font-size:13px;
  font-weight:900;
}

.account-grid p{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin:0;
}

.account-grid em{
  padding:5px 9px;
  border-radius:999px;
  color:#8c5964;
  background:#fff2f5;
  font-style:normal;
  font-size:11px;
  font-weight:900;
}

.support-links{
  display:grid;
  gap:10px;
}

.support-links h2,
.app-download-card h2{
  margin:0 0 4px;
  font-size:18px;
  font-weight:900;
}

.support-links a{
  display:grid;
  grid-template-columns:42px 1fr;
  grid-template-areas:"icon title" "icon sub";
  gap:0 11px;
  align-items:center;
  min-height:58px;
  padding:8px 10px;
  border:1px solid #f0e2e6;
  border-radius:13px;
  transition:.2s ease;
}

.support-links a:hover{
  border-color:#efb0bf;
  background:#fff7f9;
}

.support-links svg{
  grid-area:icon;
  width:34px;
  height:34px;
  padding:7px;
  border-radius:10px;
  color:var(--pink);
  background:#fff2f5;
}

.support-links span{
  grid-area:title;
  color:#3a3436;
  font-size:13px;
  font-weight:900;
}

.support-links small{
  grid-area:sub;
  color:#978a8d;
  font-size:11px;
  font-weight:700;
}

.app-download-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  background:linear-gradient(135deg,#fff,#ffe7ee);
}

.app-download-card p{
  margin:7px 0 18px;
  color:#7d7174;
  font-size:13px;
  font-weight:800;
}

.app-phone{
  flex:0 0 100px;
  height:156px;
  border-radius:20px;
  background:linear-gradient(145deg,#fff3f6,#f8dfe6);
}

.dashboard-footer{
  padding:44px 0 0;
  background:linear-gradient(180deg,#fff8fa,#fff);
  border-top:1px solid #f0e1e5;
}

.footer-dashboard-grid{
  display:grid;
  grid-template-columns:1.3fr .8fr .8fr .8fr 1fr;
  gap:42px;
  align-items:start;
}

.footer-dashboard-grid h3{
  margin:0 0 16px;
  color:#2f292b;
  font-size:15px;
  font-weight:900;
}

.footer-dashboard-grid a:not(.brand){
  display:block;
  margin-bottom:11px;
  color:#6d6366;
  font-size:13px;
  font-weight:800;
}

.footer-brand-area p{
  margin:12px 0 18px;
  color:#72676a;
  font-size:13px;
  line-height:1.9;
}

.footer-socials{
  display:flex;
  gap:10px;
}

.footer-socials a{
  width:34px;
  height:34px;
  display:grid!important;
  place-items:center;
  margin:0!important;
  border:1px solid #efcbd4;
  border-radius:50%;
  color:var(--pink)!important;
  background:#fff;
  font-weight:900;
}

.trust-row{
  display:flex;
  gap:11px;
}

.trust-box{
  width:76px;
  height:92px;
  border-radius:13px;
  background:#fff;
}

.dashboard-copy{
  margin-top:34px;
  padding:19px 0;
  border-top:1px solid #f0e1e5;
  text-align:center;
  color:#85787c;
  font-size:12px;
  font-weight:800;
}

.dashboard-page .image-slot-empty,
.dashboard-page .image-slot{
  border:1px solid #f0dfe3;
  background:linear-gradient(145deg,#fff7f9,#f8e7eb);
}

.dashboard-page .image-slot::after{content:"";display:none}

@media (max-width: 1260px){
  .dashboard-main-nav{gap:24px;padding-inline:10px 0}
  .dashboard-shell{grid-template-columns:1fr}
  .dashboard-sidebar{grid-template-columns:282px 1fr;align-items:start;order:-1}
  .help-card{grid-column:1/-1}
  .stats-grid{grid-template-columns:repeat(3,1fr)}
  .dashboard-triple,.bottom-split{grid-template-columns:1fr 1fr}
  .coupon-panel,.app-download-card{grid-column:1/-1}
}

@media (max-width: 1080px){
  .dashboard-top-actions{gap:8px}
  .dashboard-business-btn{display:none}
  .dashboard-main-nav{gap:18px}
  .appointment-grid{grid-template-columns:1fr}
  .two-one,.equal-split{grid-template-columns:1fr}
  .favorite-grid{grid-template-columns:repeat(2,1fr)}
  .footer-dashboard-grid{grid-template-columns:1.2fr 1fr 1fr;gap:28px}
}

@media (max-width: 860px){
  .dashboard-page .container{width:min(100% - 30px, var(--container))}
  .dashboard-main-nav,
  .dashboard-top-actions{display:none}
  .dashboard-header .mobile-menu-btn{display:block}
  .dashboard-mobile-panel.is-open{display:block}
  .dashboard-sidebar{grid-template-columns:1fr}
  .stats-grid{grid-template-columns:repeat(2,1fr);gap:14px}
  .dashboard-triple,.bottom-split{grid-template-columns:1fr}
  .offer-grid{grid-template-columns:1fr}
  .account-grid{grid-template-columns:1fr}
  .account-grid div,
  .account-grid div:nth-child(3n),
  .account-grid div:nth-last-child(-n+3){border-left:0;border-bottom:1px solid #f1e3e7}
  .account-grid div:last-child{border-bottom:0}
  .footer-dashboard-grid{grid-template-columns:1fr 1fr}
}

@media (max-width: 620px){
  .dashboard-main{padding-top:18px}
  .stats-grid{grid-template-columns:1fr}
  .stat-card{min-height:108px}
  .favorite-grid{grid-template-columns:1fr}
  .compare-box{grid-template-columns:1fr;gap:10px}
  .vs-badge{width:38px;height:38px}
  .review-item{grid-template-columns:70px 1fr;}
  .review-thumb{width:70px;height:66px}
  .review-item .small-btn{grid-column:1/-1;grid-row:auto;justify-self:start;min-width:92px}
  .transaction-list div{grid-template-columns:1fr;gap:4px;padding-bottom:9px;border-bottom:1px solid #f3e6e9}
  .transaction-list div:last-child{border-bottom:0}
  .alert-list article{grid-template-columns:40px 1fr;}
  .alert-list time{grid-column:2}
  .app-download-card{flex-direction:column;text-align:center}
  .app-phone{width:120px;flex-basis:150px}
  .footer-dashboard-grid{grid-template-columns:1fr}
}

@media (max-width: 420px){
  .appointment-actions{grid-template-columns:1fr}
  .dashboard-section{padding:16px 14px 18px}
  .profile-card{padding-inline:16px}
}

/* Dashboard layout correction: keep the account sidebar fixed on the right like the reference screenshot */
.dashboard-top-actions{direction:rtl}
@media (min-width:1261px){
  .dashboard-shell{
    direction:ltr;
    grid-template-columns:minmax(0,1fr) 282px;
    grid-template-areas:"content sidebar";
  }
  .dashboard-content{
    grid-area:content;
    direction:rtl;
  }
  .dashboard-sidebar{
    grid-area:sidebar;
    direction:rtl;
  }
}

/* Owner / salon dashboard page */
.owner-dashboard-page{
  --owner-container:1328px;
  background:#fff;
  color:#2c2728;
}

.owner-dashboard-page .container{
  width:min(var(--owner-container), calc(100% - 70px));
}

.owner-header{
  min-height:76px;
  background:rgba(255,255,255,.98);
  border-bottom:1px solid #efe1e4;
  position:relative;
  z-index:20;
}

.owner-header-inner{
  min-height:76px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}

.owner-brand{
  display:flex;
  align-items:center;
  gap:8px;
  color:var(--pink);
  font-size:31px;
  font-weight:900;
  letter-spacing:-1.4px;
  white-space:nowrap;
  min-width:154px;
}

.owner-brand-mark,
.owner-brand-mark svg{
  width:42px;
  height:42px;
}

.owner-brand svg{
  stroke:var(--pink);
  stroke-width:2.1;
}

.owner-nav{
  flex:1;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:30px;
  margin-inline:8px;
}

.owner-nav a{
  color:#353033;
  font-size:14px;
  font-weight:800;
  white-space:nowrap;
  transition:.18s ease;
}

.owner-nav a:hover,
.owner-nav a:first-child{
  color:var(--pink);
}

.owner-header-actions{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:360px;
  justify-content:flex-end;
  direction:ltr;
}

.owner-avatar-btn,
.owner-icon-btn,
.owner-salon-select,
.owner-preview-btn{
  border:1px solid #efdde1;
  background:#fff;
  color:#4a4144;
  min-height:38px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  transition:.18s ease;
}

.owner-avatar-btn:hover,
.owner-icon-btn:hover,
.owner-salon-select:hover,
.owner-preview-btn:hover{
  border-color:#efb9c5;
  box-shadow:0 8px 18px rgba(153,68,86,.1);
}

.owner-avatar-btn{
  direction:rtl;
  gap:7px;
  padding:3px 7px 3px 4px;
  border-radius:999px;
}

.owner-avatar-btn .image-slot{
  width:39px;
  height:39px;
  border-radius:50%;
  flex:0 0 39px;
}

.owner-avatar-btn svg,
.owner-salon-select svg{
  width:14px;
  height:14px;
  transform:rotate(90deg);
}

.owner-icon-btn{
  width:40px;
  height:40px;
  border-radius:14px;
  color:var(--pink);
  position:relative;
}

.owner-icon-btn svg{width:19px;height:19px}

.owner-icon-btn.has-badge::after{
  content:attr(data-badge);
  position:absolute;
  top:-7px;
  right:-5px;
  width:18px;
  height:18px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:var(--pink);
  color:#fff;
  font-size:10px;
  font-weight:900;
  border:2px solid #fff;
}

.owner-preview-btn{
  height:42px;
  padding:0 23px;
  border-radius:10px;
  background:linear-gradient(180deg,#e05d78,#d54866);
  color:#fff;
  border-color:transparent;
  font-size:13px;
  font-weight:900;
  box-shadow:0 10px 22px rgba(217,91,115,.21);
}

.owner-salon-select{
  direction:rtl;
  height:40px;
  padding:0 13px;
  gap:12px;
  border-radius:11px;
  font-size:13px;
  font-weight:900;
}

.owner-mobile-panel.is-open{display:block}

.owner-main{
  padding:32px 0 34px;
  background:#fff;
}

.owner-shell{
  display:grid;
  direction:ltr;
  grid-template-columns:minmax(0,1fr) 214px;
  gap:24px;
  align-items:start;
}

.owner-sidebar{
  direction:rtl;
  display:grid;
  gap:22px;
}

.owner-content{
  direction:rtl;
  min-width:0;
  display:grid;
  gap:22px;
}

.owner-card,
.owner-side-menu,
.owner-support-card,
.owner-help-banner{
  background:#fff;
  border:1px solid #eedfe3;
  border-radius:18px;
  box-shadow:0 12px 28px rgba(121,64,77,.06);
}

.owner-side-menu{
  padding:11px 0;
}

.owner-side-menu a{
  min-height:55px;
  display:grid;
  grid-template-columns:28px 1fr auto;
  align-items:center;
  gap:12px;
  padding:0 17px;
  color:#655b5d;
  font-size:14px;
  font-weight:900;
  position:relative;
  transition:.18s ease;
}

.owner-side-menu a svg{
  width:20px;
  height:20px;
  color:#c7a3aa;
}

.owner-side-menu a small{
  width:19px;
  height:19px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:var(--pink);
  background:#fff3f6;
  font-size:10px;
  font-weight:900;
}

.owner-side-menu a:hover,
.owner-side-menu a.is-active{
  color:var(--pink);
  background:linear-gradient(90deg,#fff,#fff4f7);
}

.owner-side-menu a.is-active::before{
  content:"";
  position:absolute;
  inset:11px 0 11px auto;
  width:4px;
  border-radius:5px 0 0 5px;
  background:var(--pink);
}

.owner-side-menu a.is-active svg,
.owner-side-menu a:hover svg{color:var(--pink)}

.owner-support-card{
  padding:23px 18px;
  min-height:164px;
  position:relative;
  overflow:hidden;
  background:linear-gradient(135deg,#fff,#fff0f4);
}

.owner-support-card h2{
  margin:0 0 10px;
  color:#d24a66;
  font-size:17px;
  font-weight:1000;
}

.owner-support-card p{
  margin:0 0 19px;
  color:#8b7d80;
  font-size:12px;
  line-height:1.8;
  font-weight:800;
}

.owner-support-card > svg{
  position:absolute;
  left:15px;
  bottom:16px;
  width:58px;
  height:58px;
  color:var(--pink);
  stroke-width:1.6;
}

.owner-small-primary{
  height:36px;
  border:0;
  border-radius:9px;
  padding:0 18px;
  color:#fff;
  background:linear-gradient(180deg,#df627c,#cf4e68);
  box-shadow:0 8px 18px rgba(217,91,115,.18);
  font-size:12px;
  font-weight:900;
}

.owner-outline-btn{
  height:34px;
  border:1px solid #f1d7dd;
  border-radius:9px;
  background:#fff;
  color:var(--pink);
  padding:0 13px;
  font-size:12px;
  font-weight:900;
}

.owner-link-btn{
  width:100%;
  height:36px;
  border:0;
  border-top:1px solid #f4e4e8;
  background:#fff;
  color:var(--pink);
  font-size:13px;
  font-weight:900;
  margin-top:8px;
}

.owner-hero-card{
  min-height:222px;
  display:grid;
  grid-template-columns:minmax(265px,1.4fr) minmax(330px,1.45fr) 170px 170px;
  gap:18px;
  align-items:stretch;
  padding:24px;
}

.owner-salon-summary{
  display:grid;
  grid-template-columns:118px 1fr;
  gap:18px;
  align-items:center;
  position:relative;
  padding-inline-start:4px;
}

.owner-salon-logo{
  width:112px;
  height:112px;
  border-radius:50%;
  border:4px solid #f194aa!important;
  box-shadow:0 8px 20px rgba(217,91,115,.17);
}

.owner-camera-btn{
  position:absolute;
  right:86px;
  bottom:28px;
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border:0;
  border-radius:10px;
  background:var(--pink);
  color:#fff;
  box-shadow:0 8px 16px rgba(217,91,115,.24);
}

.owner-camera-btn svg{width:18px;height:18px}

.owner-salon-summary h1{
  margin:0 0 14px;
  color:#2f292b;
  font-size:22px;
  font-weight:1000;
  letter-spacing:-.4px;
}

.owner-salon-summary h1 span{
  width:25px;
  height:25px;
  margin-right:6px;
  display:inline-grid;
  place-items:center;
  border-radius:50%;
  background:#fff0f4;
  color:var(--pink);
  vertical-align:middle;
}

.owner-salon-summary h1 svg{width:15px;height:15px}

.owner-salon-summary p{
  display:flex;
  align-items:center;
  gap:7px;
  margin:8px 0;
  color:#756a6d;
  font-size:13px;
  font-weight:800;
}

.owner-salon-summary p svg{
  width:16px;
  height:16px;
  color:#a9979c;
}

.owner-quick-box{
  align-self:center;
  border:1px solid #efdde1;
  border-radius:17px;
  padding:21px 18px 18px;
}

.owner-quick-box h2{
  margin:0 0 19px;
  text-align:center;
  color:#6d6265;
  font-size:14px;
  font-weight:900;
}

.quick-actions-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
}

.quick-actions-grid button{
  min-height:78px;
  display:grid;
  place-items:center;
  gap:9px;
  border:0;
  background:transparent;
  color:#7a6c70;
  font-size:12px;
  font-weight:900;
}

.quick-actions-grid svg{
  width:38px;
  height:38px;
  padding:9px;
  border:1px solid #f1d6dd;
  border-radius:50%;
  color:var(--pink);
  background:#fff7f9;
  transition:.18s ease;
}

.quick-actions-grid button:hover svg{
  transform:translateY(-2px);
  background:var(--pink);
  color:#fff;
}

.owner-mini-card{
  border:1px solid #efdde1;
  border-radius:16px;
  padding:18px 16px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;
  min-height:160px;
}

.owner-mini-card > span{
  color:#6f6366;
  font-size:13px;
  font-weight:900;
}

.owner-ring{
  --angle:calc(var(--value) * 3.6deg);
  width:86px;
  height:86px;
  margin:13px 0 9px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:conic-gradient(var(--pink) var(--angle), #f5e7eb 0);
  position:relative;
}

.owner-ring::before{
  content:"";
  position:absolute;
  inset:11px;
  border-radius:50%;
  background:#fff;
}

.owner-ring b{
  position:relative;
  z-index:1;
  color:#3e3638;
  font-size:22px;
  font-weight:1000;
}

.owner-mini-card small{
  color:#8d8084;
  font-size:11px;
  font-weight:800;
  line-height:1.8;
}

.owner-profile-progress small svg{
  width:15px;
  height:15px;
  color:#38bd78;
  vertical-align:middle;
}

.owner-plan strong{
  margin:15px 0 8px;
  display:flex;
  align-items:center;
  gap:8px;
  color:#2e292b;
  font-size:20px;
  font-weight:1000;
}

.owner-plan strong svg{
  width:22px;
  height:22px;
  color:#f0b62d;
}

.owner-plan .owner-small-primary{margin-top:14px;width:100%}

.owner-stats-grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:16px;
}

.owner-stat-card{
  min-height:152px;
  padding:24px 18px;
  display:grid;
  align-content:center;
  gap:10px;
}

.owner-stat-card span{
  color:#6f6467;
  font-size:13px;
  font-weight:900;
}

.owner-stat-card strong{
  color:#302b2c;
  font-size:28px;
  line-height:1.15;
  font-weight:1000;
}

.owner-stat-card small{
  color:#978b8e;
  font-size:12px;
  font-weight:800;
}

.owner-stat-card b{color:#31b779;font-weight:1000}
.owner-stat-card em{font-style:normal;color:#918487}
.owner-stat-card:nth-child(1) strong{color:#e44b69}
.owner-stat-card:nth-child(4) small{color:#f3a800;letter-spacing:1px}

.owner-two-cols{
  display:grid;
  grid-template-columns:1.35fr .85fr;
  gap:16px;
  align-items:stretch;
}

.owner-three-cols{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:16px;
  align-items:stretch;
}

.owner-card-head{
  min-height:41px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}

.owner-card-head h2,
.campaign-panel h2,
.settings-panel h2{
  margin:0;
  color:#302a2c;
  font-size:18px;
  font-weight:1000;
}

.owner-card-head.compact{
  justify-content:flex-start;
}

.owner-card-head.compact h2{margin-left:auto}
.owner-card-head.compact span{color:#86797d;font-size:12px;font-weight:900}

.reservation-card,
.weekly-calendar,
.service-card,
.team-card,
.gallery-card,
.review-panel,
.reports-panel,
.wallet-panel,
.campaign-panel,
.settings-panel,
.notifications-panel{
  padding:20px;
  overflow:hidden;
}

.owner-table-wrap{overflow:auto hidden}

.owner-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  min-width:650px;
}

.owner-table th{
  background:#fff2f5;
  color:#62575a;
  font-size:12px;
  font-weight:1000;
  padding:13px 12px;
  text-align:right;
}

.owner-table th:first-child{border-radius:0 12px 0 0}
.owner-table th:last-child{border-radius:12px 0 0 0}

.owner-table td{
  padding:14px 12px;
  border-bottom:1px solid #f1e3e7;
  color:#51484a;
  font-size:12px;
  font-weight:800;
  white-space:nowrap;
}

.owner-table td:first-child{
  display:flex;
  align-items:center;
  gap:8px;
  font-weight:900;
}

.mini-person{
  width:30px;
  height:30px;
  flex:0 0 30px;
  border-radius:50%;
}

.owner-table mark{
  min-width:66px;
  height:28px;
  display:inline-grid;
  place-items:center;
  border-radius:8px;
  font-size:11px;
  font-weight:1000;
}

.owner-table .ok{background:#e6f8ee;color:#2ca86c}
.owner-table .wait{background:#fff3db;color:#e49821}
.owner-table .cancel{background:#fff0f3;color:#e1536b}

.table-icon{
  width:32px;
  height:32px;
  display:inline-grid;
  place-items:center;
  margin-inline:2px;
  border:1px solid #f0e0e4;
  border-radius:9px;
  background:#fff;
  color:var(--pink);
  font-weight:1000;
}

.table-icon svg{width:16px;height:16px}

.week-grid{
  border:1px solid #f0e1e5;
  border-radius:14px;
  overflow:hidden;
}

.week-days{
  display:grid;
  grid-template-columns:repeat(7,1fr);
  padding-inline-start:52px;
  border-bottom:1px solid #f0e1e5;
  background:#fff;
}

.week-days span{
  min-height:48px;
  display:grid;
  place-items:center;
  color:#63585b;
  font-size:12px;
  font-weight:900;
  line-height:1.7;
}

.week-body{
  display:grid;
  grid-template-columns:52px repeat(7,1fr);
  grid-auto-rows:56px;
  background:linear-gradient(#f5e9ed 1px,transparent 1px),linear-gradient(90deg,#f5e9ed 1px,transparent 1px);
  background-size:100% 56px, calc((100% - 52px) / 7) 100%;
}

.week-body > span{
  padding:9px 7px;
  color:#75696d;
  font-size:11px;
  font-weight:800;
}

.week-body .event{
  margin:6px 4px;
  padding:8px 7px;
  border-radius:8px;
  background:#fde7ed;
  color:#76575f;
  font-size:11px;
  font-weight:900;
  line-height:1.55;
  text-align:center;
}

.circle-nav{
  width:32px;
  height:32px;
  border:1px solid #efd8de;
  border-radius:50%;
  background:#fff;
  color:var(--pink);
}
.circle-nav svg{width:16px;height:16px}

.service-list,
.staff-list{
  display:grid;
  gap:10px;
}

.service-list div{
  min-height:60px;
  display:grid;
  grid-template-columns:54px 1fr auto auto auto;
  align-items:center;
  gap:9px;
  padding:7px 0;
  border-bottom:1px solid #f1e3e7;
}

.service-list div:last-child,
.staff-list div:last-child{border-bottom:0}

.service-thumb{
  width:48px;
  height:48px;
  border-radius:10px;
}

.service-list b,
.staff-list b{
  color:#3a3335;
  font-size:13px;
  font-weight:1000;
}

.service-list small,
.staff-list small{
  color:#8a7d81;
  font-size:11px;
  font-weight:800;
  display:block;
  margin-top:4px;
}

.service-list strong{
  color:#3f383a;
  font-size:12px;
  font-weight:900;
  white-space:nowrap;
}

.staff-list div{
  display:grid;
  grid-template-columns:36px 1fr auto auto;
  align-items:center;
  gap:9px;
  padding:9px 0;
  border-bottom:1px solid #f1e3e7;
}

.staff-list em{
  color:#f4a800;
  font-style:normal;
  font-size:12px;
  font-weight:1000;
}

.staff-list span{
  color:#8a7d81;
  font-size:11px;
  font-weight:800;
}

.gallery-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:9px;
}

.gallery-grid span{
  height:84px;
  border-radius:11px;
}

.rating-box{
  float:right;
  width:104px;
  margin-left:18px;
  text-align:center;
}

.rating-box strong{
  display:block;
  color:#302a2c;
  font-size:44px;
  font-weight:1000;
}

.rating-box span{
  display:block;
  color:#f7a600;
  letter-spacing:1px;
  font-size:16px;
}

.rating-box small{
  color:#817579;
  font-size:12px;
  font-weight:800;
}

.rating-bars{
  display:grid;
  gap:8px;
  padding-top:4px;
}

.rating-bars p,
.popular-services-chart p{
  margin:0;
  display:grid;
  grid-template-columns:58px 1fr 36px;
  align-items:center;
  gap:9px;
  color:#75696d;
  font-size:11px;
  font-weight:900;
}

.rating-bars b,
.popular-services-chart b{
  height:7px;
  overflow:hidden;
  border-radius:999px;
  background:#f2e4e8;
}

.rating-bars i,
.popular-services-chart i{
  display:block;
  height:100%;
  border-radius:999px;
  background:var(--pink);
}

.rating-bars em,
.popular-services-chart em{
  font-style:normal;
  color:#8a7c80;
}

.latest-reviews{
  clear:both;
  padding-top:16px;
}

.latest-reviews h3,
.wallet-panel h3,
.chart-box h3,
.donut-box h3,
.popular-services-chart h3{
  margin:0 0 12px;
  color:#393235;
  font-size:13px;
  font-weight:1000;
}

.latest-reviews article{
  display:grid;
  grid-template-columns:34px 1fr auto;
  gap:8px;
  padding:13px 0;
  border-top:1px solid #f1e3e7;
}

.latest-reviews b{font-size:12px;font-weight:1000;color:#3a3335}
.latest-reviews em{font-style:normal;color:#f6a800;font-size:12px}
.latest-reviews p{grid-column:2/4;margin:0;color:#786c6f;font-size:11px;font-weight:800;line-height:1.8}
.latest-reviews button{grid-column:2/4;width:max-content;margin-top:4px}

.report-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}

.owner-card-head select{
  height:34px;
  min-width:130px;
  border:1px solid #f0dfe3;
  border-radius:9px;
  padding:0 12px;
  color:#74686b;
  background:#fff;
  font-size:12px;
  font-weight:900;
}

.chart-box,
.donut-box,
.popular-services-chart{
  min-height:164px;
  border:1px solid #f0e1e5;
  border-radius:14px;
  padding:14px;
  position:relative;
  overflow:hidden;
}

.chart-box strong{
  display:inline-block;
  color:#302a2c;
  font-size:20px;
  font-weight:1000;
  margin-left:8px;
}

.chart-box small{
  color:#2fb876;
  font-size:12px;
  font-weight:1000;
}

.chart-box svg{
  width:100%;
  height:82px;
  margin-top:8px;
}

.chart-box polyline{
  fill:none;
  stroke:var(--pink);
  stroke-width:4;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.chart-box polyline.blue{stroke:#8ba1e8}

.donut-box{
  display:grid;
  grid-template-columns:112px 1fr;
  gap:12px;
  align-items:center;
}

.donut-box h3{grid-column:1/-1}

.donut-box > span{
  width:96px;
  height:96px;
  border-radius:50%;
  background:conic-gradient(#8090e6 0 34%, #69c783 34% 58%, #ffd276 58% 78%, #f192aa 78% 100%);
  position:relative;
}

.donut-box > span::after{
  content:"";
  position:absolute;
  inset:21px;
  border-radius:50%;
  background:#fff;
}

.donut-box ul{
  margin:0;
  padding:0;
  list-style:none;
  display:grid;
  gap:8px;
  color:#74686b;
  font-size:11px;
  font-weight:900;
}

.popular-services-chart{
  display:grid;
  gap:10px;
  align-content:start;
}

.wallet-balance{
  border:1px solid #f0e0e4;
  border-radius:15px;
  padding:18px 16px;
  display:grid;
  gap:10px;
  margin-bottom:16px;
}

.wallet-balance span,
.wallet-list small{
  color:#7c7074;
  font-size:12px;
  font-weight:900;
}

.wallet-balance strong{
  color:#2f292b;
  font-size:24px;
  font-weight:1000;
}

.wallet-balance button{width:120px}

.wallet-list{
  display:grid;
  gap:3px;
}

.wallet-list div{
  min-height:51px;
  display:grid;
  grid-template-columns:1fr 1fr 88px 34px;
  gap:8px;
  align-items:center;
  border-bottom:1px solid #f1e3e7;
  font-size:12px;
  font-weight:900;
}

.wallet-list div:last-child{border-bottom:0}
.wallet-list .plus{color:#2daf6c}
.wallet-list .minus{color:#e14e67}
.wallet-list time{color:#8a7d81;font-size:11px}
.download-btn{width:30px;height:30px;border:0;background:#fff;color:#a9999e}.download-btn svg{width:18px;height:18px}

.campaign-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:13px;
  margin-top:18px;
}

.campaign-grid div{
  min-height:157px;
  display:grid;
  justify-items:center;
  align-content:center;
  gap:9px;
  text-align:center;
  border:1px solid #f0e1e5;
  border-radius:15px;
  background:#fff;
}

.campaign-grid svg{
  width:44px;
  height:44px;
  padding:10px;
  border-radius:50%;
  background:#fff2f5;
  color:var(--pink);
}

.campaign-grid div:nth-child(2) svg{color:#e7a715;background:#fff8de}
.campaign-grid b{font-size:13px;font-weight:1000;color:#3b3436}.campaign-grid small{font-size:11px;color:#8a7d80;font-weight:800}

.settings-list,
.notice-list{
  display:grid;
  gap:9px;
  margin-top:16px;
}

.settings-list button{
  min-height:49px;
  display:grid;
  grid-template-columns:32px 1fr auto;
  grid-template-areas:"icon title more" "icon sub more";
  gap:0 9px;
  align-items:center;
  text-align:right;
  border:1px solid #f0e1e5;
  border-radius:11px;
  background:#fff;
  padding:7px 9px;
  color:#5d5356;
}

.settings-list svg{
  grid-area:icon;
  width:26px;
  height:26px;
  padding:5px;
  border-radius:8px;
  background:#fff4f7;
  color:var(--pink);
}

.settings-list span{grid-area:title;font-size:12px;font-weight:1000}.settings-list small{grid-area:sub;font-size:10px;font-weight:800;color:#8d8084}

.notice-list div{
  min-height:56px;
  display:grid;
  grid-template-columns:34px 1fr 72px 25px;
  gap:8px;
  align-items:center;
  border:1px solid #f0e1e5;
  border-radius:12px;
  padding:9px;
}

.notice-list p{
  margin:0;
  color:#5c5356;
  font-size:12px;
  font-weight:900;
}

.notice-list time{
  color:#918589;
  font-size:10px;
  font-weight:800;
}

.notice-list > div > svg{color:var(--pink);width:19px;height:19px}

.notice-icon{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:50%;
}
.notice-icon svg{width:19px;height:19px}.notice-icon.ok{background:#e8f9ef;color:#2eb46f}.notice-icon.warn{background:#fff1dc;color:#e09b1e}

.owner-help-banner{
  min-height:98px;
  padding:19px 190px 19px 28px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:20px;
  background:linear-gradient(100deg,#fff1f5,#ffe1e9 52%,#fff7fa);
  position:relative;
  overflow:hidden;
}

.owner-help-art{
  position:absolute;
  right:35px;
  bottom:0;
  width:132px;
  height:94px;
  border:0!important;
  background:linear-gradient(145deg,#ffe7ee,#fff7fa)!important;
}

.owner-help-banner h2{
  margin:0 0 5px;
  font-size:18px;
  font-weight:1000;
  color:#312b2d;
}

.owner-help-banner p{
  margin:0;
  color:#75696d;
  font-size:13px;
  font-weight:800;
}

.owner-help-banner button{
  min-width:144px;
  height:39px;
  border:0;
  border-radius:10px;
  background:#fff;
  color:var(--pink);
  font-size:13px;
  font-weight:1000;
  box-shadow:0 8px 18px rgba(142,76,91,.08);
}

.owner-footer{margin-top:4px}

.owner-dashboard-page .image-slot-empty,
.owner-dashboard-page .image-slot{
  border:1px solid #f0dfe3;
  background:linear-gradient(145deg,#fff6f8,#f8e5ea);
}

.owner-dashboard-page .image-slot::after{content:"";display:none}

@media (max-width:1320px){
  .owner-dashboard-page .container{width:min(100% - 36px, var(--owner-container))}
  .owner-nav{gap:18px}
  .owner-header-actions{min-width:320px}
  .owner-hero-card{grid-template-columns:1.4fr 1.2fr 150px 150px;gap:14px;padding:20px}
  .quick-actions-grid{gap:7px}
}

@media (max-width:1160px){
  .owner-header-actions,.owner-nav{display:none}
  .owner-mobile-btn{display:block}
  .owner-shell{grid-template-columns:1fr}
  .owner-sidebar{order:-1;grid-template-columns:1fr 260px;align-items:start}
  .owner-side-menu{display:grid;grid-template-columns:repeat(4,1fr);padding:10px}
  .owner-side-menu a{min-height:45px;border-radius:12px;padding:0 11px;font-size:12px;grid-template-columns:23px 1fr auto}
  .owner-side-menu a.is-active::before{display:none}
  .owner-support-card{min-height:100%;}
  .owner-hero-card{grid-template-columns:1fr 1fr;}
  .owner-stats-grid{grid-template-columns:repeat(3,1fr)}
  .owner-two-cols{grid-template-columns:1fr}
  .owner-three-cols{grid-template-columns:1fr 1fr}
  .wallet-panel,.notifications-panel{grid-column:1/-1}
}

@media (max-width:860px){
  .owner-dashboard-page .container{width:min(100% - 26px, var(--owner-container))}
  .owner-main{padding-top:18px}
  .owner-sidebar{grid-template-columns:1fr}
  .owner-side-menu{grid-template-columns:1fr 1fr}
  .owner-hero-card{grid-template-columns:1fr;}
  .owner-salon-summary{grid-template-columns:98px 1fr}
  .owner-salon-logo{width:96px;height:96px}
  .owner-camera-btn{right:73px;bottom:18px}
  .owner-stats-grid{grid-template-columns:repeat(2,1fr)}
  .owner-three-cols{grid-template-columns:1fr}
  .campaign-grid{grid-template-columns:1fr}
  .report-grid{grid-template-columns:1fr}
  .owner-help-banner{padding:24px;display:grid;text-align:center;justify-items:center}
  .owner-help-art{position:static;width:120px;height:70px;order:-1}
}

@media (max-width:620px){
  .owner-brand{font-size:26px;min-width:auto}.owner-brand-mark,.owner-brand-mark svg{width:36px;height:36px}
  .owner-side-menu{grid-template-columns:1fr}
  .owner-stats-grid{grid-template-columns:1fr}
  .quick-actions-grid{grid-template-columns:1fr 1fr}
  .owner-mini-card{min-height:130px}
  .service-list div{grid-template-columns:46px 1fr auto;}
  .service-list strong{grid-column:2}.service-list .table-icon{grid-column:auto}
  .staff-list div{grid-template-columns:34px 1fr auto}
  .staff-list span{grid-column:2/4}
  .gallery-grid{grid-template-columns:1fr 1fr}
  .wallet-list div{grid-template-columns:1fr;gap:3px;padding:10px 0}.download-btn{justify-self:start}
  .notice-list div{grid-template-columns:34px 1fr}.notice-list time,.notice-list > div > svg{grid-column:2}.owner-help-banner button{width:100%}
}

.owner-footer .footer-dashboard-grid{
  grid-template-columns:1.25fr .72fr .72fr .72fr .72fr 1fr;
  gap:34px;
}

@media (max-width:1160px){
  .owner-footer .footer-dashboard-grid{grid-template-columns:1.2fr 1fr 1fr;}
}
@media (max-width:760px){
  .owner-footer .footer-dashboard-grid{grid-template-columns:1fr 1fr;}
}
@media (max-width:520px){
  .owner-footer .footer-dashboard-grid{grid-template-columns:1fr;}
}

/* Single salon page */
.salon-single-page{
  --single-line:#efdfe3;
  --single-shadow:0 14px 36px rgba(125,61,76,.08);
  background:#fff;
}

.salon-single-page .container{
  width:min(1320px, calc(100% - 72px));
}

.salon-single-page .site-header{
  box-shadow:0 6px 24px rgba(66,45,50,.035);
}

.single-header-inner{
  height:78px;
  gap:19px;
}

.single-header .brand{
  min-width:145px;
}

.single-header .brand-text{
  font-size:33px;
}

.single-header .brand small{
  font-size:9px;
}

.single-main-nav{
  gap:25px;
}

.single-main-nav a{
  font-size:13px;
}

.single-actions{
  gap:9px;
}

.icon-square{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border:1px solid #efdee3;
  border-radius:11px;
  background:#fff;
  color:#d75a72;
  box-shadow:0 7px 16px rgba(130,76,86,.055);
  transition:.2s ease;
}

.icon-square svg{
  width:20px;
  height:20px;
}

.icon-square:hover,
.icon-square.is-active{
  color:#fff;
  background:var(--pink);
  border-color:var(--pink);
}

.single-main{
  padding:16px 0 0;
  background:#fff;
}

.breadcrumb{
  min-height:32px;
  display:flex;
  align-items:center;
  gap:9px;
  color:#7d7173;
  font-size:12px;
  font-weight:700;
  margin-bottom:9px;
}

.breadcrumb a:hover,
.breadcrumb strong{
  color:#332d2f;
}

.salon-hero-card{
  display:grid;
  grid-template-columns:minmax(0, 1.35fr) 540px;
  gap:0;
  border:1px solid var(--single-line);
  border-radius:18px;
  overflow:hidden;
  background:#fff;
  box-shadow:var(--single-shadow);
}

.single-gallery-hero{
  position:relative;
  min-height:337px;
  border-left:1px solid var(--single-line);
}

.single-cover{
  width:100%;
  height:100%;
  min-height:337px;
  border:0;
  background:linear-gradient(135deg,#fff6f8,#f3e1e6);
}

.salon-single-page .image-slot::after{
  content:"";
  display:none;
}

.gallery-count{
  position:absolute;
  right:24px;
  top:24px;
  height:42px;
  padding:0 17px;
  border-radius:999px;
  border:1px solid rgba(239,223,227,.9);
  background:rgba(255,255,255,.94);
  color:#d65470;
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:13px;
  font-weight:900;
  box-shadow:0 10px 22px rgba(101,54,64,.10);
}

.gallery-count svg{
  width:18px;
  height:18px;
}

.single-info-card{
  min-height:337px;
  display:grid;
  grid-template-columns:168px 1fr;
  gap:30px;
  align-items:center;
  padding:38px 38px 32px;
  background:#fff;
}

.single-logo{
  width:150px;
  height:150px;
  border:0;
  border-radius:50%;
  box-shadow:0 12px 24px rgba(39,28,30,.12), inset 0 0 0 8px #fff5f7;
  background:linear-gradient(135deg,#fff8fa,#f2d6dd);
}

.single-info-content h1{
  margin:0 0 12px;
  display:flex;
  align-items:center;
  gap:7px;
  color:#262122;
  font-size:31px;
  font-weight:900;
  letter-spacing:-.4px;
}

.single-info-content h1 svg{
  width:22px;
  height:22px;
  color:#e04d6e;
  fill:#fff2f5;
}

.single-rating-line{
  display:flex;
  align-items:center;
  gap:9px;
  color:#64595b;
  font-size:13px;
  font-weight:800;
  margin-bottom:15px;
}

.single-rating-line b{
  color:#282324;
  font-size:15px;
}

.single-rating-line span,
.rating-stars,
.comment-head b,
.similar-card span{
  color:#ffad00;
  letter-spacing:1px;
}

.single-address,
.single-open{
  display:flex;
  align-items:center;
  gap:8px;
  margin:0 0 12px;
  color:#655b5d;
  font-size:13px;
  font-weight:700;
  line-height:1.7;
}

.single-address svg,
.single-open svg{
  width:19px;
  height:19px;
  color:#e15f77;
}

.single-open strong{
  color:#13a45a;
  font-weight:900;
}

.single-open span{
  color:#363032;
  font-weight:800;
}

.single-contact-icons{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:14px;
  margin-top:28px;
}

.single-contact-icons button,
.single-contact-icons a{
  border:0;
  background:transparent;
  color:#453d3f;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  font-size:12px;
  font-weight:800;
}

.single-contact-icons button svg,
.single-contact-icons a svg{
  width:43px;
  height:43px;
  padding:11px;
  border:1px solid #efdfe3;
  border-radius:50%;
  color:#dc5a73;
  background:#fff8fa;
  transition:.2s ease;
}

.single-contact-icons button:hover svg,
.single-contact-icons button.is-active svg,
.single-contact-icons a:hover svg{
  color:#fff;
  background:#d95772;
  border-color:#d95772;
}

.single-action-bar{
  height:72px;
  display:grid;
  grid-template-columns:repeat(4, 1fr) 220px;
  gap:14px;
  align-items:center;
  padding:0 22px;
  margin-bottom:16px;
  border:1px solid var(--single-line);
  border-top:0;
  border-radius:0 0 18px 18px;
  background:#fff;
  box-shadow:0 10px 25px rgba(125,61,76,.055);
}

.single-action-btn,
.single-book-btn{
  min-height:43px;
  border:1px solid var(--single-line);
  border-radius:10px;
  background:#fff;
  color:#6a5d60;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  font-size:13px;
  font-weight:900;
  transition:.2s ease;
}

.single-action-btn svg,
.single-book-btn svg{
  width:18px;
  height:18px;
  color:#d95b73;
}

.single-action-btn:hover,
.single-action-btn.is-active{
  color:#d95b73;
  border-color:#eab9c3;
  background:#fff6f8;
}

.single-book-btn{
  color:#fff;
  border:0;
  background:linear-gradient(180deg,#de627b,#cf4f69);
  box-shadow:0 12px 25px rgba(217,91,115,.22);
}

.single-book-btn svg{
  color:#fff;
}

.single-layout{
  display:grid;
  grid-template-columns:minmax(0, 1fr) 370px;
  gap:22px;
  align-items:start;
}

.single-content{
  display:grid;
  gap:18px;
  min-width:0;
}

.single-panel,
.booking-card,
.guarantee-card,
.similar-section{
  background:#fff;
  border:1px solid var(--single-line);
  border-radius:18px;
  box-shadow:0 12px 30px rgba(125,61,76,.06);
}

.single-panel{
  padding:22px;
}

.single-panel h2,
.booking-card h2,
.similar-section h2{
  margin:0;
  color:#2b2627;
  font-size:20px;
  font-weight:900;
  letter-spacing:-.2px;
}

.about-panel p{
  margin:12px 0 25px;
  color:#5c5355;
  font-size:14px;
  font-weight:700;
  line-height:2;
}

.feature-icons-row{
  display:grid;
  grid-template-columns:repeat(5, 1fr);
  gap:16px;
}

.feature-icons-row div{
  min-height:91px;
  display:grid;
  place-items:center;
  gap:8px;
  text-align:center;
  color:#574c4e;
  font-size:13px;
  font-weight:900;
}

.feature-icons-row span{
  width:57px;
  height:57px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#fff6f8;
  border:1px solid #f1dbe1;
  color:#dd5b74;
}

.feature-icons-row svg{
  width:28px;
  height:28px;
}

.panel-head-inline{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  margin-bottom:18px;
}

.mini-link{
  color:#e05772;
  font-size:12px;
  font-weight:900;
}

.service-card-grid{
  display:grid;
  grid-template-columns:repeat(6, 1fr);
  gap:14px;
}

.service-mini-card{
  overflow:hidden;
  border:1px solid #efdee2;
  border-radius:12px;
  background:#fff;
  box-shadow:0 6px 14px rgba(125,61,76,.055);
}

.service-mini-card .image-slot{
  width:100%;
  height:118px;
  border:0;
  background:linear-gradient(135deg,#fff3f6,#f5dfe5);
}

.service-mini-card h3{
  margin:12px 12px 5px;
  color:#302a2b;
  font-size:13px;
  font-weight:900;
}

.service-mini-card p{
  margin:0 12px 13px;
  color:#8a7b7e;
  font-size:11px;
  font-weight:800;
}

.service-mini-card b{
  color:#e04f6c;
}

.gallery-panel{
  position:relative;
  overflow:hidden;
}

.gallery-strip,
.similar-strip{
  display:flex;
  gap:14px;
  overflow:auto;
  scroll-behavior:smooth;
  scrollbar-width:none;
  direction:rtl;
  padding:1px;
}

.gallery-strip::-webkit-scrollbar,
.similar-strip::-webkit-scrollbar{display:none}

.gallery-strip .image-slot{
  flex:0 0 178px;
  height:122px;
  border:0;
  border-radius:12px;
  background:linear-gradient(135deg,#fff6f8,#f0d8df);
}

.single-slider-arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:2;
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border:1px solid #f0dde2;
  border-radius:50%;
  background:#fff;
  color:#d85a73;
  box-shadow:0 8px 20px rgba(125,61,76,.10);
}

.single-slider-prev{right:14px}
.single-slider-next{left:14px}
.single-slider-next svg{transform:rotate(180deg)}

.reviews-block{
  display:grid;
  grid-template-columns:minmax(0, 1fr) 290px;
  gap:18px;
}

.comments-panel{
  display:grid;
  gap:13px;
}

.comment-item{
  position:relative;
  border:1px solid #f0e0e4;
  border-radius:13px;
  padding:15px 44px 15px 16px;
  background:#fff;
}

.comment-menu{
  position:absolute;
  right:13px;
  top:17px;
  width:24px;
  height:36px;
  border:0;
  background:transparent;
  color:#e05e76;
  font-size:24px;
  line-height:1;
}

.comment-head{
  display:grid;
  grid-template-columns:auto auto 1fr;
  gap:12px;
  align-items:center;
  margin-bottom:7px;
}

.comment-head strong{
  color:#2d2729;
  font-size:13px;
  font-weight:900;
}

.comment-head span,
.comment-item small{
  color:#928588;
  font-size:11px;
  font-weight:800;
}

.comment-head b{
  justify-self:end;
  font-size:14px;
}

.comment-item p{
  margin:0 0 7px;
  color:#615759;
  font-size:12.5px;
  font-weight:700;
  line-height:1.9;
}

.rating-panel{
  text-align:center;
}

.rating-big{
  margin:18px 0 3px;
  color:#161213;
  font-size:58px;
  font-weight:900;
  letter-spacing:-1px;
}

.rating-stars{
  font-size:28px;
  letter-spacing:4px;
}

.rating-panel p{
  margin:8px 0 21px;
  color:#5c5355;
  font-size:13px;
  font-weight:900;
}

.rating-bars{
  display:grid;
  gap:10px;
}

.rating-bars div{
  display:grid;
  grid-template-columns:54px 1fr 38px;
  align-items:center;
  gap:9px;
  color:#6d6264;
  font-size:11px;
  font-weight:800;
}

.rating-bars i{
  height:7px;
  overflow:hidden;
  border-radius:999px;
  background:#f4e5e9;
  position:relative;
}

.rating-bars i::before{
  content:"";
  position:absolute;
  right:0;
  top:0;
  bottom:0;
  width:var(--w);
  background:#de5b75;
  border-radius:inherit;
}

.location-panel{
  display:grid;
  grid-template-columns:315px 1fr 1fr;
  gap:24px;
  align-items:center;
}

.map-placeholder{
  width:100%;
  height:172px;
  border:0;
  border-radius:13px;
  background:linear-gradient(135deg,#f5f8f9,#fce9ee);
}

.address-list,
.amenities-list{
  display:grid;
  gap:10px;
}

.address-list h2,
.amenities-list h2{
  margin-bottom:5px;
}

.address-list p,
.amenities-list p{
  margin:0;
  color:#5e5456;
  display:flex;
  align-items:center;
  gap:9px;
  font-size:13px;
  font-weight:800;
}

.address-list svg,
.amenities-list svg{
  width:18px;
  height:18px;
  color:#d95b73;
}

.single-sidebar{
  position:sticky;
  top:18px;
  display:grid;
  gap:16px;
}

.booking-card{
  padding:24px;
}

.booking-card h2{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:9px;
  color:#342d2f;
  margin-bottom:22px;
}

.booking-card h2 svg{
  width:22px;
  height:22px;
  color:#d95b73;
}

.booking-form{
  display:grid;
  gap:15px;
}

.booking-form label{
  display:grid;
  gap:8px;
  color:#4c4345;
  font-size:12px;
  font-weight:900;
}

.booking-form input,
.booking-form select{
  height:51px;
  border:1px solid #ecdce1;
  border-radius:10px;
  background:#fff;
  color:#51474a;
  outline:0;
  padding:0 14px;
  font-size:13px;
  font-weight:800;
}

.booking-form select{
  appearance:none;
  background-image:linear-gradient(45deg, transparent 50%, #aa7d84 50%),linear-gradient(135deg, #aa7d84 50%, transparent 50%);
  background-position:18px 22px, 12px 22px;
  background-size:6px 6px;
  background-repeat:no-repeat;
}

.time-select{
  display:grid;
  grid-template-columns:1fr repeat(4, 58px);
  gap:8px;
  align-items:center;
}

.time-select span{
  grid-column:1/-1;
  color:#4c4345;
  font-size:12px;
  font-weight:900;
}

.time-select button{
  height:39px;
  border:1px solid #ecdce1;
  border-radius:9px;
  background:#fff;
  color:#6a5f61;
  font-size:12px;
  font-weight:900;
}

.time-select button.is-selected,
.time-select button:hover{
  color:#d95b73;
  border-color:#dd7088;
  background:#fff3f6;
}

.booking-form h3{
  margin:2px 0 -2px;
  color:#332d2f;
  font-size:16px;
  font-weight:900;
}

.booking-summary{
  border:1px solid #f0cdd5;
  border-radius:13px;
  padding:16px;
  background:#fff7f9;
  display:grid;
  gap:9px;
}

.booking-summary h4{
  margin:0 0 3px;
  color:#d8516b;
  font-size:14px;
  font-weight:900;
}

.booking-summary p{
  margin:0;
  display:flex;
  justify-content:space-between;
  color:#76686b;
  font-size:12px;
  font-weight:800;
}

.booking-summary p b{
  color:#392f32;
}

.booking-summary strong{
  margin-top:7px;
  border-top:1px solid #f0d5dc;
  padding-top:12px;
  display:flex;
  justify-content:space-between;
  color:#d8516b;
  font-size:13px;
  font-weight:900;
}

.booking-summary em{
  font-style:normal;
  color:#d8516b;
}

.final-book-btn{
  width:100%;
  height:54px;
  border:0;
  border-radius:10px;
  font-size:15px;
}

.booking-form small{
  color:#8d8083;
  text-align:center;
  font-size:11px;
  font-weight:700;
}

.guarantee-card{
  padding:24px;
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:15px;
  text-align:center;
}

.guarantee-card h3{
  grid-column:1/-1;
  margin:0 0 3px;
  color:#312b2d;
  font-size:15px;
  font-weight:900;
}

.guarantee-card div{
  display:grid;
  gap:8px;
  color:#6a5e61;
  font-size:12px;
  font-weight:900;
}

.guarantee-card span{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  justify-self:center;
  color:#d95b73;
  border-radius:50%;
  background:#fff6f8;
  border:1px solid #efdce1;
}

.similar-section{
  position:relative;
  margin:25px 0 30px;
  padding:20px 22px 25px;
}

.single-section-head{
  margin-bottom:18px;
}

.single-section-head > div{
  padding-right:0;
}
.single-section-head > div::before{display:none}

.similar-strip{
  gap:18px;
}

.similar-card{
  flex:0 0 224px;
  border:1px solid #ecdde1;
  border-radius:13px;
  overflow:hidden;
  background:#fff;
  box-shadow:0 8px 18px rgba(125,61,76,.055);
  padding-bottom:13px;
}

.similar-card .image-slot{
  height:118px;
  border:0;
  background:linear-gradient(135deg,#fff7f9,#f0dae1);
}

.similar-card h3{
  margin:12px 12px 4px;
  color:#312a2c;
  font-size:13px;
  font-weight:900;
}

.similar-card p{
  margin:0 12px 5px;
  color:#877a7d;
  font-size:11px;
  font-weight:800;
}

.similar-card span{
  display:block;
  margin:0 12px 10px;
  font-size:12px;
}

.similar-card a{
  height:33px;
  margin:0 12px;
  border:1px solid #e88fa0;
  border-radius:8px;
  color:#d8526d;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
  font-weight:900;
}

.single-footer{
  margin-top:0;
  padding-top:0;
}

.single-footer-top{
  display:grid;
  grid-template-columns:430px 1fr;
  gap:25px;
  align-items:stretch;
  padding-top:28px;
  padding-bottom:24px;
}

.footer-app-card,
.footer-newsletter-card{
  min-height:166px;
  border:1px solid #f0dfe3;
  border-radius:18px;
  overflow:hidden;
  background:linear-gradient(135deg,#fff,#fff1f5);
  box-shadow:0 12px 26px rgba(125,61,76,.055);
}

.footer-app-card{
  display:grid;
  grid-template-columns:150px 1fr;
  gap:18px;
  padding:20px;
  align-items:center;
}

.footer-phone{
  width:135px;
  height:135px;
  border:0;
  background:linear-gradient(135deg,#fff8fa,#f1dbe2);
}

.footer-app-card h3,
.footer-newsletter-card h3{
  margin:0 0 8px;
  color:#342e30;
  font-size:18px;
  font-weight:900;
}

.footer-app-card p,
.footer-newsletter-card p{
  margin:0 0 17px;
  color:#776a6d;
  font-size:13px;
  font-weight:800;
}

.store-buttons{
  display:flex;
  gap:10px;
}

.store-buttons a{
  height:39px;
  padding:0 17px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:8px;
  background:#191617;
  color:#fff;
  font-size:12px;
  font-weight:900;
}

.footer-newsletter-card{
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:25px;
}

.single-footer .footer-grid{
  grid-template-columns:1.35fr repeat(5, 1fr);
  padding-top:35px;
}

.back-to-top{
  position:fixed;
  left:25px;
  bottom:25px;
  z-index:20;
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#fff;
  background:linear-gradient(180deg,#de627b,#cf4f69);
  box-shadow:0 12px 26px rgba(217,91,115,.22);
}

.back-to-top svg{
  transform:rotate(90deg);
}

@media (max-width: 1240px){
  .salon-hero-card{grid-template-columns:1fr 440px}
  .single-info-card{grid-template-columns:120px 1fr; gap:20px; padding:28px}
  .single-logo{width:116px;height:116px}
  .single-info-content h1{font-size:25px}
  .service-card-grid{grid-template-columns:repeat(3,1fr)}
  .single-main-nav{display:none}
  .mobile-menu-btn{display:block}
}

@media (max-width: 1024px){
  .salon-single-page .container{width:min(100% - 34px, 1320px)}
  .salon-hero-card{grid-template-columns:1fr}
  .single-gallery-hero{border-left:0;border-bottom:1px solid var(--single-line)}
  .single-layout{grid-template-columns:1fr}
  .single-sidebar{position:static}
  .single-action-bar{grid-template-columns:repeat(2,1fr); height:auto; padding:16px}
  .single-book-btn{grid-column:1/-1}
  .reviews-block{grid-template-columns:1fr}
  .location-panel{grid-template-columns:1fr 1fr}
  .map-placeholder{grid-column:1/-1}
  .single-footer-top{grid-template-columns:1fr}
}

@media (max-width: 760px){
  .single-header .brand{min-width:auto}
  .single-header .brand-text{font-size:28px}
  .single-actions .btn{display:none}
  .single-actions .icon-square{width:38px;height:38px}
  .single-info-card{grid-template-columns:1fr;text-align:center;justify-items:center}
  .single-info-content h1{justify-content:center}
  .single-contact-icons{grid-template-columns:repeat(2,1fr)}
  .single-action-bar{grid-template-columns:1fr}
  .feature-icons-row{grid-template-columns:repeat(2,1fr)}
  .service-card-grid{grid-template-columns:repeat(2,1fr)}
  .location-panel{grid-template-columns:1fr}
  .time-select{grid-template-columns:repeat(4,1fr)}
  .time-select span{grid-column:1/-1}
  .guarantee-card{grid-template-columns:1fr}
  .footer-app-card{grid-template-columns:1fr;text-align:center;justify-items:center}
  .store-buttons{justify-content:center;flex-wrap:wrap}
}

@media (max-width: 520px){
  .salon-single-page .container{width:min(100% - 22px, 1320px)}
  .single-gallery-hero,.single-cover{min-height:235px}
  .single-info-card{padding:22px 16px}
  .single-info-content h1{font-size:22px}
  .single-panel,.booking-card,.guarantee-card,.similar-section{border-radius:14px;padding:16px}
  .service-card-grid{grid-template-columns:1fr}
  .feature-icons-row{grid-template-columns:1fr}
  .comment-head{grid-template-columns:1fr}
  .rating-bars div{grid-template-columns:48px 1fr 34px}
  .single-footer .footer-grid{grid-template-columns:1fr}
}

/* Physical column fixes for RTL single page */
.salon-single-page .salon-hero-card,
.salon-single-page .single-layout,
.salon-single-page .reviews-block,
.salon-single-page .location-panel,
.salon-single-page .single-footer-top{
  direction:ltr;
}
.salon-single-page .single-gallery-hero,
.salon-single-page .single-info-card,
.salon-single-page .single-content,
.salon-single-page .single-sidebar,
.salon-single-page .comments-panel,
.salon-single-page .rating-panel,
.salon-single-page .location-panel > *,
.salon-single-page .footer-app-card,
.salon-single-page .footer-newsletter-card{
  direction:rtl;
}

@media (max-width:1024px){
  .salon-single-page .salon-hero-card,
  .salon-single-page .single-layout,
  .salon-single-page .reviews-block,
  .salon-single-page .location-panel,
  .salon-single-page .single-footer-top{direction:rtl}
}


/* === User dashboard tab behavior fix === */
.dashboard-page.profile-tab-mode .dashboard-content > section{display:none!important;}
.dashboard-page.profile-tab-mode .dashboard-content > section.profile-active-wrapper{display:block!important;animation:profileTabFade .22s ease both;}
.dashboard-page.profile-tab-mode .dashboard-content > section.stats-grid.profile-active-wrapper,
.dashboard-page.profile-tab-mode .dashboard-content > section.dashboard-split.profile-active-wrapper,
.dashboard-page.profile-tab-mode .dashboard-content > section.dashboard-triple.profile-active-wrapper,
.dashboard-page.profile-tab-mode .dashboard-content > section.profile-generated-panel.profile-active-wrapper{display:grid!important;}
.dashboard-page.profile-tab-mode .dashboard-content .dashboard-section{display:none!important;}
.dashboard-page.profile-tab-mode .dashboard-content .dashboard-section.profile-active-panel{display:block!important;}
.profile-generated-panel{grid-template-columns:1fr!important;}
.profile-generated-panel .dash-card{padding:28px;border-radius:22px;}
.profile-empty-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:18px;}
.profile-empty-grid article{padding:20px;border:1px solid #f0dde4;border-radius:18px;background:#fff;box-shadow:0 12px 28px rgba(114,52,69,.055);}
.profile-empty-grid i{display:grid;place-items:center;width:54px;height:54px;border-radius:18px;background:#fff4f7;color:var(--pink,#dc4770);font-size:24px;margin-bottom:12px;}
.profile-empty-grid h3{font-size:17px;font-weight:900;margin:0 0 8px;color:#241f22;}
.profile-empty-grid p{font-size:13px;line-height:1.9;color:#7e7377;margin:0;font-weight:700;}
@keyframes profileTabFade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(max-width:900px){.profile-empty-grid{grid-template-columns:1fr}}

/* v3.0 dynamic archives and article UI */
:root{--front-primary:#d9468f;--front-secondary:#8b5cf6;--front-ink:#17121a;--front-muted:#6f6574;--front-line:#efe7f0;--front-bg:#fbf7fb;--front-card:#fff;--front-radius:26px;--front-shadow:0 24px 70px rgba(57,23,54,.10)}
.front-body{margin:0;background:linear-gradient(180deg,#fff 0,#fbf7fb 40%,#fff 100%);font-family:Tahoma,Arial,sans-serif;color:var(--front-ink)}
.front-container{width:min(1200px,calc(100% - 32px));margin-inline:auto}.front-section{padding:42px 0 70px}.front-section-tight{margin-bottom:34px}.front-kicker{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border-radius:999px;background:#fff1f8;color:var(--front-primary);font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.front-archive-hero{padding:54px 0 42px;background:radial-gradient(circle at 10% 10%,rgba(217,70,143,.18),transparent 36%),linear-gradient(135deg,#fff,#fff4fa 50%,#f4edff)}.front-hero-grid{display:grid;grid-template-columns:1.5fr .8fr;gap:30px;align-items:center}.front-archive-hero h1,.front-post-hero h1{font-size:clamp(32px,5vw,58px);line-height:1.25;margin:16px 0 14px}.front-archive-hero p,.front-post-hero p{font-size:17px;color:var(--front-muted);line-height:2;max-width:760px}.front-search-bar{display:flex;gap:10px;background:#fff;border:1px solid var(--front-line);border-radius:22px;padding:8px;box-shadow:var(--front-shadow);max-width:720px;margin-top:24px}.front-search-bar input{flex:1;border:0;outline:0;padding:13px 16px;font-size:15px;background:transparent}.front-search-bar button,.front-btn{border:0;border-radius:16px;padding:12px 18px;background:#fff;border:1px solid var(--front-line);color:var(--front-ink);font-weight:800;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}.front-search-bar button,.front-btn-primary{background:linear-gradient(135deg,var(--front-primary),var(--front-secondary));color:#fff;border-color:transparent}.front-stats-card{display:grid;grid-template-columns:1fr 1fr;gap:14px}.front-stats-card div{background:rgba(255,255,255,.85);backdrop-filter:blur(14px);border:1px solid var(--front-line);border-radius:24px;padding:22px;box-shadow:var(--front-shadow)}.front-stats-card b{display:block;font-size:28px}.front-stats-card span{color:var(--front-muted);font-size:13px}.front-layout{display:grid;grid-template-columns:310px 1fr;gap:26px;align-items:start}.front-sidebar{position:sticky;top:22px;display:grid;gap:18px}.front-filter-card,.front-card,.front-featured-post,.front-article,.front-comment-form{background:var(--front-card);border:1px solid var(--front-line);border-radius:var(--front-radius);box-shadow:var(--front-shadow)}.front-filter-card{padding:20px}.front-filter-head,.front-section-head,.front-results-head{display:flex;justify-content:space-between;align-items:end;gap:16px;margin-bottom:18px}.front-filter-card h2,.front-filter-card h3,.front-section-head h2,.front-results-head h2{margin:.25rem 0}.front-filter-card label{display:block;margin:13px 0 7px;font-weight:800;font-size:13px;color:#3c3340}.front-filter-card input,.front-filter-card select,.front-comment-form input,.front-comment-form textarea{width:100%;box-sizing:border-box;border:1px solid var(--front-line);border-radius:16px;background:#fff;padding:12px 13px;font-size:14px;outline:0}.front-two-col{display:grid;grid-template-columns:1fr 1fr;gap:12px}.front-check{display:flex!important;align-items:center;gap:8px}.front-check input{width:auto}.front-mini-list{display:grid;gap:8px}.front-mini-list a{display:flex;justify-content:space-between;gap:10px;text-decoration:none;color:var(--front-ink);padding:10px 0;border-bottom:1px solid #f5eef5}.front-mini-list small,.front-muted,.small{color:var(--front-muted)}.front-card-grid,.front-feature-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px}.front-feature-strip{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.front-card{overflow:hidden}.front-card-media{display:block;position:relative;aspect-ratio:1.35/1;background:#f6edf5;overflow:hidden}.front-card-media img{width:100%;height:100%;object-fit:cover;display:block;transition:.35s}.front-card:hover .front-card-media img{transform:scale(1.04)}.front-float-badge{position:absolute;top:14px;right:14px;background:rgba(255,255,255,.92);border:1px solid rgba(255,255,255,.7);border-radius:999px;padding:7px 12px;font-weight:900;font-size:12px;color:var(--front-primary)}.front-card-body{padding:18px}.front-card-body h3{margin:0 0 8px;font-size:20px;line-height:1.6}.front-card-body a{color:inherit;text-decoration:none}.front-card-headline{display:flex;justify-content:space-between;gap:12px;align-items:start}.front-rating{background:#fff8e6;color:#a06500;border:1px solid #ffe1a3;border-radius:999px;padding:5px 9px;font-size:12px;font-weight:900;white-space:nowrap}.front-meta-grid{display:grid;gap:8px;color:#4b4450;font-size:13px;line-height:1.7}.front-card-actions{display:flex;gap:10px;align-items:center;padding:0 18px 18px;flex-wrap:wrap}.front-post-meta{display:flex;gap:12px;flex-wrap:wrap;color:var(--front-muted);font-size:13px}.front-tag-row{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}.front-tag-row a{padding:7px 10px;border-radius:999px;background:#f8eef6;color:var(--front-primary);text-decoration:none;font-size:12px;font-weight:800}.front-pagination{margin-top:26px}.front-empty-state{text-align:center;border:1px dashed #e7d9e8;background:#fff;border-radius:24px;padding:40px;grid-column:1/-1}.front-featured-post{display:grid;grid-template-columns:1fr .8fr;gap:22px;align-items:center;padding:24px;margin-bottom:32px}.front-featured-copy h2{font-size:32px;line-height:1.55}.front-featured-copy a{text-decoration:none;color:inherit}.front-featured-image{display:block;border-radius:22px;overflow:hidden;aspect-ratio:1.4/1}.front-featured-image img{width:100%;height:100%;object-fit:cover}.front-post-hero{padding:42px 0;background:linear-gradient(135deg,#fff,#fff4fa)}.front-post-hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:34px;align-items:center}.front-post-cover{width:100%;aspect-ratio:1.35/1;object-fit:cover;border-radius:30px;box-shadow:var(--front-shadow)}.front-link{text-decoration:none;color:var(--front-primary);font-weight:900}.front-article-layout{display:grid;grid-template-columns:280px 1fr;gap:28px;align-items:start}.front-article-side{position:sticky;top:20px;display:grid;gap:16px}.front-article{padding:30px}.front-article-body{font-size:17px;line-height:2.25}.front-article-body h2{font-size:30px;margin-top:34px;scroll-margin-top:20px}.front-article-body h3{font-size:24px;margin-top:28px}.front-article-body blockquote{border-right:4px solid var(--front-primary);background:#fff7fb;border-radius:16px;padding:18px 22px;margin:22px 0}.front-article-body figure{margin:24px 0}.front-article-body figure img{width:100%;border-radius:22px}.front-article-body figcaption{text-align:center;color:var(--front-muted);font-size:13px;margin-top:8px}.front-toc a{display:block;text-decoration:none;color:#443946;padding:8px 0;border-bottom:1px solid #f4edf3}.front-toc .level-3{padding-right:14px;font-size:13px}.front-faq{border:1px solid var(--front-line);border-radius:18px;padding:16px;margin:10px 0;background:#fff}.front-faq summary{font-weight:900;cursor:pointer}.front-alert{border-radius:16px;padding:12px 14px;margin:12px 0}.front-alert.success{background:#ecfdf3;color:#157347}.front-alert.danger{background:#fff1f2;color:#be123c}.front-comments{margin-top:34px}.front-comment-form{padding:22px;margin-bottom:18px}.front-comment-form label{display:block;margin:13px 0 7px;font-weight:800}.front-comment-list{display:grid;gap:14px}.front-comment{display:flex;gap:12px;background:#fff;border:1px solid var(--front-line);border-radius:22px;padding:16px}.front-comment.reply{margin-top:12px;background:#fbf7fb}.front-comment-avatar{width:42px;height:42px;border-radius:16px;background:linear-gradient(135deg,var(--front-primary),var(--front-secondary));color:#fff;display:flex;align-items:center;justify-content:center;font-weight:900;flex:0 0 42px}.front-comment-content{flex:1}.front-comment-head{display:flex;justify-content:space-between;gap:12px;color:var(--front-muted);font-size:13px}.front-comment-head b{color:var(--front-ink)}
@media(max-width:900px){.front-hero-grid,.front-layout,.front-featured-post,.front-post-hero-grid,.front-article-layout{grid-template-columns:1fr}.front-sidebar,.front-article-side{position:static}.front-stats-card{grid-template-columns:1fr 1fr}.front-search-bar{flex-direction:column}.front-search-bar button{width:100%}.front-archive-hero h1,.front-post-hero h1{font-size:34px}.front-article{padding:20px}}
@media(max-width:560px){.front-stats-card,.front-two-col{grid-template-columns:1fr}.front-card-grid,.front-feature-strip{grid-template-columns:1fr}.front-container{width:min(100% - 20px,1200px)}}