/* Paylaşılan sosyal komponentler: ikonlar, avatar+rozet, takip, story, yorumlar, profil */
.mg-icon{display:inline-block;vertical-align:middle;flex:none}
.social-sidebar nav a i,.app-tools button,.mini-user>i{display:inline-flex;align-items:center;justify-content:center}
.social-sidebar nav a i{width:21px}
.app-tools .top-create{display:grid;place-items:center}
.app-search{gap:9px}
.create-post-button{display:inline-flex;align-items:center;justify-content:center;gap:8px}
.mini-user>span{overflow:hidden}
.mini-user>span img,.top-avatar img{width:100%;height:100%;object-fit:cover}
.top-avatar{overflow:hidden}

.user-avatar{position:relative;flex:none;width:var(--ua,40px);height:var(--ua,40px);border:0;padding:0;background:none;border-radius:50%;cursor:pointer}
.user-avatar>span{position:absolute;inset:0;border-radius:50%;overflow:hidden;background:#232a32;display:grid;place-items:center;font-size:calc(var(--ua,40px)*.24);font-weight:800;color:#fff}
.user-avatar>span img{width:100%;height:100%;object-fit:cover}
.user-avatar.has-story{padding:3px}
.user-avatar.has-story:before{content:"";position:absolute;inset:-2px;border-radius:50%;background:conic-gradient(#e9003f,#ff8a4b,#e9003f 60%,#ff2d6b,#e9003f)}
.user-avatar.has-story>span{position:relative;inset:auto;width:100%;height:100%;border:2px solid #070a0d}

.user-badge{display:flex;align-items:center;gap:11px;min-width:0}
.ub-names{display:grid;gap:2px;min-width:0}
.ub-names b{display:inline-flex;align-items:center;gap:5px;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ub-names b .mg-icon{color:#e9003f}
.ub-names small{font-size:9px;color:#78808a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ub-names:hover b{color:#e9003f}

.follow-button{flex:none;border:1px solid #7d1028;background:transparent;color:#e9003f;border-radius:15px;padding:7px 14px;font-size:10px;font-weight:700;transition:.15s}
.follow-button:hover:not(:disabled){background:rgba(233,0,63,.1)}
.follow-button.following{border-color:#2a323b;color:#9aa1ab}
.follow-button.large{padding:11px 22px;font-size:11px;border-radius:9px;background:#e9003f;color:#fff;border-color:#e9003f}
.follow-button.large.following{background:transparent;color:#c6cbd1;border-color:#2a323b}
.follow-button:disabled{opacity:.6}

.post-card header{display:flex;align-items:center;gap:12px}
.post-card header .user-badge{display:flex;align-items:center;flex:1;min-width:0}
.post-card header .post-header-side{display:flex;align-items:center;gap:9px}
.post-card header .user-avatar{margin-left:0;align-self:center}
.post-card header .follow-button{margin-left:0;align-self:center;border:1px solid #7d1028;background:transparent;color:#e9003f}
.post-card header .follow-button.following{border-color:#2a323b;color:#9aa1ab}
.post-card header .post-menu{margin-left:0;align-self:center}
.post-menu{border:0;background:none;color:#8d959f;display:grid;place-items:center}
.post-menu:hover{color:#fff}
.post-copy{cursor:pointer}
.post-media{cursor:pointer}
.post-actions button{display:inline-flex;align-items:center;gap:6px}
.post-actions .liked{color:#e9003f}
.post-actions .saved{color:#e9a900}
.post-detail-card .post-card{padding:18px;background:#0c1116;border:1px solid #1c2229;border-radius:12px;margin-bottom:24px}
.post-detail-card .post-copy,.post-detail-card .post-media,.post-detail-card .post-actions{margin-left:0}
.post-detail-card .post-actions{border-bottom:0}

.stories .story{cursor:pointer;display:grid;justify-items:center;gap:6px;border:0;background:none;padding:0}
.stories .story small{font-size:8px;color:#b3b8bf;max-width:64px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.story-overlay{position:fixed;inset:0;z-index:80;background:rgba(2,3,5,.88);backdrop-filter:blur(6px);display:grid;place-items:center;padding:18px}
.story-frame{width:min(430px,100%);background:#0b0f14;border:1px solid #232b33;border-radius:16px;overflow:hidden;display:grid}
.story-frame header{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px}
.story-close{border:0;background:none;color:#c6cbd1;display:grid;place-items:center}
.story-close:hover{color:#fff}
.story-progress{display:flex;gap:4px;padding:0 14px 10px}
.story-progress span{flex:1;height:3px;border-radius:2px;background:#2a323b}
.story-progress span.done{background:#e9003f}
.story-stage{position:relative;aspect-ratio:9/14;background:#000}
.story-stage img,.story-stage video{width:100%;height:100%;object-fit:contain}
.story-nav{position:absolute;top:50%;transform:translateY(-50%);width:36px;height:36px;border-radius:50%;border:0;background:rgba(10,13,16,.65);color:#fff;display:grid;place-items:center}
.story-nav.prev{left:10px}
.story-nav.next{right:10px}

.comment-list{display:grid;gap:10px}
.comment-item{background:#0c1116;border:1px solid #1c2229;border-radius:12px;padding:13px 15px}
.comment-item.is-reply{margin-left:34px}
.comment-item p{margin:9px 0 0;font-size:11.5px;line-height:1.6;color:#d7dade;overflow-wrap:anywhere}
.comment-item footer{display:flex;align-items:center;gap:12px;margin-top:9px}
.comment-likes{display:inline-flex;align-items:center;gap:5px;font-size:9px;color:#e9003f}
.comment-reply{border:0;background:none;color:#78808a;font-size:9px;font-weight:700}
.comment-reply:hover{color:#fff}
.replying-chip{display:flex;align-items:center;justify-content:space-between;background:#141b22;border:1px solid #232b33;border-radius:8px;padding:7px 11px;margin-bottom:8px;font-size:9px;color:#9aa1ab}
.replying-chip button{border:0;background:none;color:#8d959f;display:grid;place-items:center}

.profile-cover{height:190px;border-radius:14px;overflow:hidden;background:linear-gradient(120deg,#12181f,#1a0f14)}
.profile-cover img{width:100%;height:100%;object-fit:cover}
.profile-head{display:flex;align-items:flex-start;gap:18px;margin:-34px 6px 0;position:relative}
.profile-ava .user-avatar>span{border:4px solid #070a0d}
.profile-ava .user-avatar.has-story>span{border-width:3px}
.profile-id{flex:1;min-width:0;padding-top:40px}
.profile-id h1{display:flex;align-items:center;gap:7px;font:700 20px 'Space Grotesk';margin:0}
.profile-id h1 .mg-icon{color:#e9003f}
.profile-id>small{font-size:11px;color:#78808a}
.profile-bio{margin:9px 0 0;font-size:11px;line-height:1.6;color:#c9cdd2}
.profile-meta{display:flex;flex-wrap:wrap;gap:14px;margin-top:9px;font-size:10px;color:#8a919b}
.profile-meta span,.profile-meta a{display:inline-flex;align-items:center;gap:5px}
.profile-meta a{color:#e9003f}
.profile-actions{padding-top:44px}
.profile-stats{display:flex;gap:10px;margin:20px 0 24px}
.profile-stats>div{flex:1;background:#0c1116;border:1px solid #1c2229;border-radius:12px;padding:13px;text-align:center}
.profile-stats b{font-size:15px}
.profile-stats small{display:block;margin-top:4px;font-size:9px;color:#78808a}
.profile-posts .post-card{background:#0c1116;border:1px solid #1c2229;border-radius:12px;padding:16px;margin-bottom:12px}
.profile-posts .post-copy,.profile-posts .post-media,.profile-posts .post-actions{margin-left:0}
.profile-posts .post-actions{border-bottom:0}
.stories-empty{display:grid;align-content:center;padding:0 8px}
.stories-empty small{font-size:9px;color:#666e78}
.stories-note{display:flex;align-items:center;gap:10px;margin:4px 0 8px;background:#141b22;border:1px solid #232b33;border-radius:9px;padding:9px 13px;font-size:10px;color:#c6cbd1}
.stories-note button{border:0;background:none;color:#8d959f;display:grid;place-items:center;margin-left:auto}
.story-ring.add-story i img{width:100%;height:100%;object-fit:cover}
.profile-tabs{margin:4px 0 18px}
.vehicle-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.vehicle-card{background:#0c1116;border:1px solid #1c2229;border-radius:13px;overflow:hidden;transition:.2s}
.vehicle-card:hover{border-color:#2b333d}
.vehicle-photo{position:relative;height:150px;background:#10161c;display:grid;place-items:center;color:#3a434d}
.vehicle-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.vehicle-photo .club-private{position:absolute;right:9px;top:9px;background:rgba(7,10,13,.8)}
.vehicle-media-count{position:absolute;right:9px;bottom:9px;background:rgba(7,10,13,.8);border:1px solid #262d35;border-radius:6px;padding:3px 7px;font-size:8px;color:#c6cbd1}
.vehicle-body{display:flex;align-items:center;gap:10px;padding:12px 13px 8px}
.vehicle-brand{width:26px;height:26px;object-fit:contain;flex:none}
.vehicle-names{min-width:0}
.vehicle-names b{display:block;font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vehicle-names small{display:block;margin-top:3px;font-size:9px;color:#78808a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vehicle-stats{display:flex;gap:14px;padding:0 13px 13px}
.vehicle-stats span{display:inline-flex;align-items:center;gap:5px;font-size:9px;color:#78808a}
.route-grid{display:grid;gap:12px;margin-bottom:14px}
.route-card{display:flex;gap:14px;background:#0c1116;border:1px solid #1c2229;border-radius:13px;padding:12px;transition:.2s}
.route-card:hover{border-color:#2b333d}
.route-img{width:150px;height:92px;flex:none;border-radius:9px;overflow:hidden;background:#10161c;display:grid;place-items:center;color:#3a434d}
.route-img img{width:100%;height:100%;object-fit:cover}
.route-body{flex:1;min-width:0}
.route-body b{font-size:12px}
.route-body p{margin:5px 0 0;font-size:9.5px;line-height:1.5;color:#8a919b;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.route-body small{display:inline-flex;align-items:center;gap:5px;margin-top:7px;font-size:9px;color:#78808a}
.vd-gallery{margin-bottom:16px}
.vd-main{position:relative;aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:#0c1116;border:1px solid #1c2229;display:grid;place-items:center;color:#3a434d}
.vd-main img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.vd-main .club-private{position:absolute;left:12px;top:12px;background:rgba(7,10,13,.8)}
.vd-count{position:absolute;right:12px;bottom:12px;background:rgba(7,10,13,.8);border:1px solid #262d35;border-radius:7px;padding:4px 9px;font-size:9px;color:#c6cbd1}
.vd-thumbs{display:flex;gap:8px;margin-top:9px;overflow-x:auto;padding-bottom:3px;scrollbar-width:none}
.vd-thumbs::-webkit-scrollbar{display:none}
.vd-thumbs button{flex:none;width:76px;height:52px;border-radius:8px;overflow:hidden;border:2px solid transparent;background:#10161c;padding:0;cursor:pointer;opacity:.65;transition:.15s}
.vd-thumbs button img{width:100%;height:100%;object-fit:cover}
.vd-thumbs button.on{border-color:#e9003f;opacity:1}
.vd-thumbs button:hover{opacity:1}
.vd-head{display:flex;align-items:center;justify-content:space-between;gap:14px;background:#0c1116;border:1px solid #1c2229;border-radius:13px;padding:15px 17px;margin-bottom:12px;flex-wrap:wrap}
.vd-title{display:flex;align-items:center;gap:13px;min-width:0}
.vd-brand{width:38px;height:38px;object-fit:contain;flex:none}
.vd-title h1{font:700 17px 'Space Grotesk';margin:0}
.vd-title small{display:block;margin-top:4px;font-size:10px;color:#78808a}
.vd-actions{display:flex;gap:8px}
.vd-owner{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#0c1116;border:1px solid #1c2229;border-radius:13px;padding:13px 16px;margin-bottom:16px}
.vd-audio{width:100%;height:40px}
.auth-gate-boot{min-height:100vh;display:grid;place-items:center;background:#070a0d}
.vd-maint{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:10px}
.vd-services{display:grid;gap:10px}
.vd-service{background:#0c1116;border:1px solid #1c2229;border-radius:11px;padding:13px 15px}
.vd-service-head{display:flex;align-items:center;gap:11px}
.vd-service-head>i{width:32px;height:32px;flex:none;border-radius:9px;background:rgba(233,0,63,.1);color:#e9003f;display:grid;place-items:center}
.vd-service-head>div{flex:1;min-width:0}
.vd-service-head b{display:block;font-size:11.5px}
.vd-service-head small{display:block;margin-top:2px;font-size:9px;color:#78808a}
.vd-remaining{flex:none;font-size:9px;font-weight:800;color:#22c55e;border:1px solid #1d5c36;border-radius:7px;padding:4px 9px;white-space:nowrap}
.vd-remaining.soon{color:#eab308;border-color:#4d3f10}
.vd-service-meta{display:block;margin-top:9px;font-size:9px;color:#78808a}
.vd-bar{height:5px;border-radius:3px;background:#1b222a;margin-top:8px;overflow:hidden}
.vd-bar b{display:block;height:100%;background:#22c55e;border-radius:3px}
.vd-bar b.hot{background:#e9003f}
.vd-rows{display:grid;gap:8px}
.vd-row{display:flex;align-items:center;gap:12px;background:#0c1116;border:1px solid #1c2229;border-radius:11px;padding:12px 14px;color:inherit}
.vd-row>i{width:32px;height:32px;flex:none;border-radius:9px;background:rgba(233,0,63,.1);color:#e9003f;display:grid;place-items:center}
.vd-row b{display:block;font-size:11.5px}
.vd-row small{display:block;margin-top:3px;font-size:9px;color:#78808a}
a.vd-row:hover{border-color:#2b333d}
.vd-props{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.vd-prop{background:#0c1116;border:1px solid #1c2229;border-radius:11px;padding:12px 14px}
.vd-prop small{display:block;font-size:8.5px;color:#78808a;text-transform:uppercase;letter-spacing:.5px}
.vd-prop b{display:block;margin-top:5px;font-size:12.5px}
@media(max-width:760px){.profile-head{flex-wrap:wrap}.profile-actions{padding-top:12px}.comment-item.is-reply{margin-left:16px}.vehicle-grid{grid-template-columns:1fr}.route-card{flex-direction:column}.route-img{width:100%;height:130px}.vd-props{grid-template-columns:repeat(2,1fr)}}
.post-card{position:relative}.double-like-heart{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);color:#e9003f;pointer-events:none;animation:doubleLikeHeart .75s ease-out forwards;z-index:5}.double-like-heart svg{fill:#e9003f}@keyframes doubleLikeHeart{0%{opacity:0;scale:.35}25%{opacity:1;scale:1.15}100%{opacity:0;scale:1.3}}

/* Araç sahibi düzenleme formları */
.vd-tool{display:flex;justify-content:flex-end;margin-bottom:10px}
.vd-form{background:#0c1116;border:1px solid #232b33;border-radius:12px;padding:15px 16px;margin-bottom:12px}
.vd-form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:11px}
.vd-form-grid label,.vd-maint-modal label{display:grid;gap:6px;font-size:9.5px;font-weight:700;color:#9aa1ab}
.vd-form-grid input,.vd-form-grid select,.vd-maint-modal input{width:100%;height:40px;background:#10161c;border:1px solid #1d252d;border-radius:8px;padding:0 12px;color:#fff;font:11px Manrope;outline:0}
.vd-form-grid input:focus,.vd-form-grid select:focus,.vd-maint-modal input:focus{border-color:#3a434d}
.vd-form-wide{grid-column:1/-1}
.vd-form-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:13px}
.vd-form-actions .modal-cancel,.vd-form-actions .new-topic-button{height:38px;padding:0 16px}
.vd-file ::deep input[type=file],.vd-file input[type=file]{font-size:10px;color:#9aa1ab;padding:9px 0;height:auto;border:0;background:none}
.vd-file-name{font-weight:400;color:#22c55e}
.vd-row-body{flex:1;min-width:0;color:inherit}
.vd-del{flex:none;display:inline-flex;align-items:center;gap:5px;border:1px solid #262d35;background:transparent;color:#8d959f;border-radius:8px;padding:7px 10px;font-size:9px;font-weight:700;transition:.15s}
.vd-del:hover{border-color:#6b1c2c;color:#e9003f}
.vd-del.confirm{border-color:#6b1c2c;color:#e9003f;background:rgba(233,0,63,.08)}
.vd-edit{height:32px;padding:0 13px;font-size:10px;display:inline-flex;align-items:center;gap:6px}
.vd-maint-modal{width:min(560px,100%);max-height:86vh;overflow-y:auto}
.vd-modal-sub{display:flex;align-items:center;gap:7px;margin:15px 0 9px;font-size:10.5px;color:#c6cbd1;letter-spacing:.3px}
.vd-maint-modal .vd-form-grid+.vd-modal-sub{border-top:1px solid #1b222a;padding-top:13px}
@media(max-width:760px){.vd-form-grid{grid-template-columns:1fr}}

/* Gerçek harita (Leaflet) */
.mg-map{height:236px;border-radius:10px;overflow:hidden;border:1px solid #232b33;margin:12px 0 13px;background:#0b0f13;position:relative;z-index:0}
.mg-pin-wrap{background:none;border:0}
.mg-pin{width:20px;height:20px;background:#e9003f;border:2.5px solid #fff;border-radius:50% 50% 50% 4px;transform:rotate(-45deg);box-shadow:0 4px 12px rgba(233,0,63,.55)}
.leaflet-container{background:#0b0f13;font-family:Manrope,Arial,sans-serif}
.leaflet-popup-content-wrapper,.leaflet-popup-tip{background:#11161c;color:#e6e9ec;box-shadow:0 8px 24px rgba(0,0,0,.5)}
.leaflet-popup-content{font-size:11px;margin:10px 13px}
.leaflet-popup-content span{color:#9aa1ab;font-size:9.5px}
.leaflet-popup-close-button{color:#8d959f!important}
.leaflet-control-attribution{background:rgba(7,10,13,.7)!important;color:#5c646e!important;font-size:8px!important}
.leaflet-control-attribution a{color:#78808a!important}

/* Paylaş + Ayarlar gerçek formlar */
.create-preview{position:relative;cursor:pointer}
.create-preview input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer}
.create-file-list{display:flex;flex-wrap:wrap;gap:7px;justify-content:center}
.create-file{display:inline-flex;align-items:center;gap:6px;background:#141b22;border:1px solid #232b33;border-radius:8px;padding:7px 10px;font-size:9.5px;color:#c6cbd1}
.create-file button{border:0;background:none;color:#8d959f;display:grid;place-items:center;position:relative;z-index:2}
.create-file button:hover{color:#e9003f}
.create-note{font-size:9px;color:#78808a}
.settings-stack{display:grid;gap:14px;max-width:760px}
.settings-card h2{display:flex;align-items:center;gap:8px}
.settings-ok{margin:10px 0 0;font-size:10px;color:#22c55e;font-weight:700}

/* Duyuru içeriği — backend HTML döner */
.announcement-body{color:#9aa3ad;font-size:12.5px;line-height:1.65;display:grid;gap:8px}
.announcement-body h3{color:#e7ecf2;font-size:13px;margin:6px 0 0;font-family:"Space Grotesk",sans-serif}
.announcement-body p{margin:0}
.announcement-body strong{color:#e7ecf2}
.announcement-body ul{margin:0;padding-left:18px;display:grid;gap:4px}
.announcement-body a{color:#e9003f}
.announcement-body img{max-width:100%;border-radius:10px}

/* Blog detay */
.blog-detail-main{max-width:860px}
.blog-detail{background:#0c1116;border:1px solid #1c2229;border-radius:18px;overflow:hidden}
.blog-detail-head{padding:22px 24px 16px;display:grid;gap:10px}
.blog-detail-head small{color:#78808a;font-size:11px;letter-spacing:.4px;text-transform:uppercase}
.blog-detail-head h1{margin:0;font-family:"Space Grotesk",sans-serif;font-size:24px;color:#eef2f6;line-height:1.25}
.blog-detail-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.blog-detail-actions{display:flex;align-items:center;gap:8px}
.blog-detail-actions .pd-stat{display:inline-flex;align-items:center;gap:6px;color:#78808a;font-size:12px}
.blog-detail-cover{width:100%;max-height:420px;object-fit:cover;display:block}
.blog-detail-body{padding:20px 24px 26px;color:#aab3bd;font-size:13.5px;line-height:1.75;display:grid;gap:12px}
.blog-detail-body h1,.blog-detail-body h2,.blog-detail-body h3{color:#e7ecf2;font-family:"Space Grotesk",sans-serif;margin:10px 0 0;font-size:17px;line-height:1.3}
.blog-detail-body h1{font-size:19px}
.blog-detail-body p{margin:0}
.blog-detail-body strong{color:#e7ecf2}
.blog-detail-body ul,.blog-detail-body ol{margin:0;padding-left:20px;display:grid;gap:6px}
.blog-detail-body img{max-width:100%;border-radius:12px}
.blog-detail-body a{color:#e9003f}
.blog-detail-body blockquote{margin:0;padding:10px 14px;border-left:3px solid #e9003f;background:#10161c;border-radius:0 10px 10px 0}
.blog-detail-body table{width:100%;border-collapse:collapse;font-size:12.5px}
.blog-detail-body td,.blog-detail-body th{border:1px solid #1c2229;padding:8px 10px;text-align:left}
.blog-detail-comments{margin-top:18px}
.blog-card{text-decoration:none}
.explore-blog-item{text-decoration:none;display:flex;gap:10px;align-items:center}

/* Statik (tıklamasız) avatar — kanal satırı gibi kapsayıcının onclick'i çalışır */
.user-avatar.is-static{display:grid;place-items:center;cursor:inherit}

/* Composer gerçek paylaşım düzeni */
.post-avatar.mine{overflow:hidden}
.post-avatar.mine img{width:100%;height:100%;object-fit:cover;border-radius:inherit}
.composer-media-link{display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border-radius:8px;color:#8c939e;font-size:10px;font-weight:700;transition:color .2s,background .2s}
.composer-media-link:hover{color:#fff;background:#161b22}
.composer-media-link svg{color:#e9003f}
.composer-error{display:block;color:#ff6b81;font-size:9.5px;margin:4px 0}

/* Hikaye ekle — gerçek yükleme etiketi */
.story-add-label{cursor:pointer;position:relative}
.story-add-label input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer}
.story-add-label.busy{opacity:.6;pointer-events:none}

/* Kendi gönderini sil */
.post-delete{display:inline-flex;align-items:center;gap:6px;border:1px solid #2a3039;background:none;color:#78808a;border-radius:8px;padding:6px 9px;cursor:pointer;font-size:9.5px;font-weight:700;transition:all .2s}
.post-delete:hover{border-color:#e9573f;color:#e9573f}
.post-delete.armed{background:#e9573f;border-color:#e9573f;color:#fff}
.post-card.is-deleted{opacity:.45;pointer-events:none}
.post-deleted-note{margin-top:10px;font-size:10px;color:#e9573f;font-weight:700}
