/* Otomatik & toplu SMS sahnesi — .sm-* (sayfaya özel). Sol: sohbet ekranı, sağ: aşama rayı + toplu SMS kartı */
.sm{display:grid;grid-template-columns:230px minmax(0,1fr);gap:28px;align-items:center;padding:8px 0}
.sm-phone{justify-self:center}

/* sohbet ekranı */
.sm-head{display:flex;align-items:center;gap:8px;padding-bottom:8px;border-bottom:1px solid #e4eae6}
.sm-av{width:28px;height:28px;border-radius:50%;background:#1f7a57;color:#fff;font-size:9.5px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;flex:none}
.sm-head b{display:block;font-size:11.5px;color:#0e2a20}
.sm-head small{display:block;font-size:9px;color:#5b6b62}
.sm-thread{display:flex;flex-direction:column;gap:7px;flex:1;min-height:0}
.sm-day{align-self:center;font-size:8.5px;font-weight:700;color:#8a9a91;background:#e4eae6;padding:2px 8px;border-radius:999px}
.sm-msg{display:none;flex-direction:column;align-items:flex-start;gap:4px}
.sm-msg.show{display:flex;animation:smIn .35s ease-out both}
.sm-msg.me{align-items:flex-end}
.sm-msg .fph-bub{max-width:92%}
.sm-msg.me .fph-bub{background:#1f7a57;color:#fff;border-radius:12px 12px 3px 12px}
.sm-msg.me .fph-bub small{opacity:.75}
.sm-typing{display:none;align-items:center;gap:3px;padding:9px 11px;border-radius:12px 12px 12px 3px;background:#fff;align-self:flex-start}
.sm-typing.show{display:inline-flex;animation:smIn .25s ease-out both}
.sm-typing i{width:5px;height:5px;border-radius:50%;background:#8a9a91;animation:smDot .9s ease-in-out infinite}
.sm-typing i:nth-child(2){animation-delay:.15s}.sm-typing i:nth-child(3){animation-delay:.3s}
@keyframes smDot{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-3px);opacity:1}}
@keyframes smIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.sm-input{margin-top:auto;margin-bottom:16px;height:32px;border-radius:999px;background:#fff;border:1px solid #e4eae6;display:flex;align-items:center;padding:0 12px;font-size:10px;color:#8a9a91}

/* sağ sütun: aşama rayı */
.sm-side{display:flex;flex-direction:column;gap:18px;min-width:0}
.sm-rail{position:relative;display:flex;flex-direction:column;gap:22px;padding-left:4px}
.sm-rail::before{content:"";position:absolute;left:15px;top:14px;bottom:14px;width:2px;background:rgba(255,255,255,.12)}
.sm-stg{position:relative;display:flex;align-items:center;gap:14px;min-width:0}
.sm-dot{position:relative;z-index:1;width:24px;height:24px;border-radius:50%;background:#0b1f15;border:2px solid rgba(255,255,255,.18);color:rgba(255,255,255,.4);display:inline-flex;align-items:center;justify-content:center;flex:none;transition:background .35s,border-color .35s,color .35s,box-shadow .35s}
.sm-stg b{display:block;font-size:14px;font-weight:800;color:rgba(255,255,255,.5);transition:color .35s}
.sm-stg small{display:block;font-size:11.5px;color:rgba(214,235,224,.55);margin-top:2px;min-height:15px;transition:color .35s}
.sm-tag{margin-left:auto;font-size:10px;font-weight:800;letter-spacing:.05em;color:#05130c;background:#34d399;padding:3px 8px;border-radius:999px;opacity:0;transform:translateX(6px);transition:opacity .3s,transform .3s;flex:none;text-transform:uppercase}
.sm-stg.on .sm-dot{background:#34d399;border-color:#34d399;color:#05130c;box-shadow:0 0 0 5px rgba(52,211,153,.18)}
.sm-stg.on b{color:#fff}.sm-stg.on small{color:rgba(214,235,224,.85)}
.sm-stg.on .sm-tag{opacity:1;transform:none}

/* toplu SMS kartı (statik) */
.sm-bulk{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:14px 16px;display:flex;gap:12px;align-items:flex-start}
.sm-bulk i{width:34px;height:34px;border-radius:10px;background:rgba(252,148,0,.18);color:#FC9400;display:inline-flex;align-items:center;justify-content:center;flex:none;font-style:normal}
.sm-bulk b{display:block;font-size:13.5px;color:#fff}
.sm-bulk span{display:block;font-size:12px;color:rgba(214,235,224,.72);line-height:1.45;margin-top:2px}
.sm-bulk em{display:inline-flex;align-items:center;gap:5px;margin-top:8px;font-style:normal;font-size:11px;font-weight:700;color:#fbbf24;background:rgba(251,191,36,.12);padding:3px 9px;border-radius:999px}

/* reduced motion: son kare statik */
.sm.sm-rm .sm-msg.show,.sm.sm-rm .sm-tag,.sm.sm-rm .sm-dot{animation:none;transition:none}

@media (max-width:600px){
 .sm{grid-template-columns:minmax(0,1fr);gap:22px;justify-items:stretch}
 .sm-rail{flex-direction:row;gap:8px;padding-left:0}
 .sm-rail::before{display:none}
 .sm-stg{flex:1;flex-direction:column;align-items:flex-start;gap:8px;background:rgba(255,255,255,.04);border-radius:12px;padding:10px}
 .sm-stg b{font-size:12px}.sm-stg small{font-size:10px}
 .sm-tag{margin-left:0}
}