/* MS Appointments - в стила на сайта (navy/gold) */
.ms-ap{
	--ap-navy:var(--navy,#01102F);
	--ap-navy2:var(--navy-2,#0A2148);
	--ap-gold:var(--gold,#D0A353);
	--ap-gold-soft:var(--gold-soft,#E3C07A);
	--ap-gold-dark:var(--gold-dark,#A6802F);
	--ap-gold-tint:var(--gold-tint,#F8EFDC);
	--ap-ink:#132436;
	--ap-mute:#7a8694;
	--ap-line:#eae6dc;
	max-width:940px;margin:0 auto;color:var(--ap-ink);
}
.ms-ap *{box-sizing:border-box}

/* прогрес */
.ms-ap-progress{display:flex;align-items:flex-start;justify-content:center;margin:0 0 26px}
.ms-ap-pstep{display:flex;flex-direction:column;align-items:center;gap:9px}
.ms-ap-dot{width:14px;height:14px;border-radius:50%;background:#ded7c7;transition:background .2s}
.ms-ap-pstep.on .ms-ap-dot{background:var(--ap-gold)}
.ms-ap-plabel{font-family:var(--display,'Oswald',sans-serif);text-transform:uppercase;letter-spacing:.09em;
	font-size:.72rem;color:var(--ap-mute);transition:color .2s;white-space:nowrap}
.ms-ap-pstep.on .ms-ap-plabel{color:var(--ap-navy)}
.ms-ap-line{width:120px;max-width:22vw;height:3px;background:#e7e1d2;margin:6px 16px 0;border-radius:2px}

/* карта */
.ms-ap-step1{background:#fff;border:1px solid var(--ap-line);border-radius:20px;overflow:hidden;
	box-shadow:0 24px 60px -28px rgba(1,16,47,.32)}
.ms-ap-grid{display:grid;grid-template-columns:minmax(0,280px) minmax(0,1fr)}

/* ляв панел */
.ms-ap-side{background:linear-gradient(165deg,var(--ap-navy2),var(--ap-navy));color:#fff;padding:34px 28px}
.ms-ap-side h2{font-family:var(--display,'Oswald',sans-serif);font-size:1.55rem;line-height:1.15;margin:0 0 10px;color:#fff;letter-spacing:.01em}
.ms-ap-type{color:var(--ap-gold-soft);font-weight:600;margin:0 0 26px;padding-bottom:22px;border-bottom:1px solid rgba(201,158,67,.24)}
.ms-ap-meta{list-style:none;margin:0;padding:0;display:grid;gap:16px}
.ms-ap-meta li{display:flex;gap:12px;align-items:flex-start;color:rgba(255,255,255,.82);font-size:.92rem;line-height:1.4}
.ms-ap-meta li span{flex:none;width:20px;text-align:center}

/* дясна част - календарът заема цялата ширина, часовете излизат отдолу */
.ms-ap-main{min-width:0}
.ms-ap-cal{padding:30px 26px;max-width:540px;margin:0 auto}
.ms-ap-cal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.ms-ap-month{font-family:var(--display,'Oswald',sans-serif);font-size:1.12rem;font-weight:600;color:var(--ap-navy)}
.ms-ap-nav{border:1px solid var(--ap-line);background:#fff;width:34px;height:34px;border-radius:9px;cursor:pointer;
	font-size:1.05rem;color:var(--ap-navy);line-height:1;display:flex;align-items:center;justify-content:center;transition:.15s}
.ms-ap-nav:hover{border-color:var(--ap-gold);color:var(--ap-gold-dark);background:var(--ap-gold-tint)}
.ms-ap-nav:disabled{opacity:.3;cursor:not-allowed}
.ms-ap-dow,.ms-ap-days{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}
.ms-ap-dow{margin-bottom:8px}
.ms-ap-dow span{text-align:center;font-size:.62rem;letter-spacing:.05em;color:var(--ap-mute);font-weight:600}
.ms-ap-day{aspect-ratio:1;border:0;background:transparent;border-radius:50%;cursor:default;color:#c7ccd3;
	font-size:.92rem;font-weight:500;display:flex;align-items:center;justify-content:center;transition:.14s}
.ms-ap-day.is-free{color:var(--ap-navy);cursor:pointer;font-weight:700;position:relative}
.ms-ap-day.is-free::after{content:"";position:absolute;bottom:6px;width:4px;height:4px;border-radius:50%;background:var(--ap-gold)}
.ms-ap-day.is-free:hover{background:var(--ap-gold-tint)}
.ms-ap-day.is-sel{background:var(--ap-navy);color:#fff}
.ms-ap-day.is-sel::after{background:var(--ap-gold-soft)}

/* часове - под календара, на цялата ширина */
.ms-ap-slots{border-top:1px solid var(--ap-line);background:#fbfaf6;padding:24px 26px}
.ms-ap-slots-head{font-size:.84rem;color:var(--ap-mute);font-weight:600;margin:0 0 16px;text-align:center}
.ms-ap-slots-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(94px,1fr));gap:10px}
.ms-ap-slot{border:1px solid var(--ap-gold);background:#fff;color:var(--ap-navy);border-radius:10px;padding:12px 8px;
	font-size:.98rem;font-weight:700;cursor:pointer;transition:.14s;text-align:center}
.ms-ap-slot:hover{background:var(--ap-gold);color:#20160a;transform:translateY(-1px)}

/* стъпка 2 */
.ms-ap-step2{background:#fff;border:1px solid var(--ap-line);border-radius:20px;padding:30px;
	box-shadow:0 24px 60px -28px rgba(1,16,47,.32);max-width:560px;margin:0 auto}
.ms-ap-step2 h2{font-family:var(--display,'Oswald',sans-serif);color:var(--ap-navy);margin:6px 0 4px}
.ms-ap-back{background:none;border:0;color:var(--ap-mute);cursor:pointer;font-size:.9rem;padding:0;margin-bottom:8px}
.ms-ap-back:hover{color:var(--ap-navy)}
.ms-ap-chosen{background:var(--ap-gold-tint);color:var(--ap-navy);border-radius:12px;padding:13px 15px;
	font-weight:700;font-size:.92rem;margin:0 0 20px;border:1px solid rgba(201,158,67,.3)}
.ms-ap-form{display:grid;gap:12px}
.ms-ap-form input,.ms-ap-form textarea{width:100%;padding:13px 15px;border:1px solid #d9d2c2;border-radius:11px;font:inherit;color:var(--ap-ink)}
.ms-ap-form input:focus,.ms-ap-form textarea:focus{outline:0;border-color:var(--ap-gold);box-shadow:0 0 0 3px rgba(208,163,83,.2)}
.ms-ap-hp{position:absolute;left:-9999px;height:0;overflow:hidden}
.ms-ap-error{background:#fbe9e9;color:#a12020;border-radius:10px;padding:10px 12px;font-size:.9rem;margin:0}
.ms-ap-submit{background:var(--ap-gold);color:#20160a;border:0;border-radius:999px;padding:15px;
	font-family:var(--display,'Oswald',sans-serif);text-transform:uppercase;letter-spacing:.07em;font-weight:600;font-size:1rem;cursor:pointer;transition:.2s}
.ms-ap-submit:hover{background:var(--ap-gold-soft)}
.ms-ap-submit:disabled{opacity:.6;cursor:default}

/* успех */
.ms-ap-done{background:#fff;border:1px solid var(--ap-line);border-radius:20px;padding:48px 28px;text-align:center;
	max-width:560px;margin:0 auto;box-shadow:0 24px 60px -28px rgba(1,16,47,.32)}
.ms-ap-check{width:66px;height:66px;border-radius:50%;background:#1c7a3f;color:#fff;font-size:2rem;
	display:flex;align-items:center;justify-content:center;margin:0 auto 18px}
.ms-ap-done h2{font-family:var(--display,'Oswald',sans-serif);color:var(--ap-navy);margin:0 0 10px}
.ms-ap-done-when{font-weight:700;color:var(--ap-navy);font-size:1.05rem;margin:0 0 8px}
.ms-ap-muted{color:var(--ap-mute)}

@media (max-width:720px){
	.ms-ap-grid{grid-template-columns:1fr}
	.ms-ap-side{padding:26px 24px}
	.ms-ap-side h2{font-size:1.4rem}
	.ms-ap-cal{padding:24px 18px;max-width:none}
	.ms-ap-day{font-size:1rem}
}