/* ======================================================================
   SOSYALJET V10 — PREMIUM UX / BRAND-AWARE UI
   Fixes popular badges, header auth, platform color identity, expandable
   service cards, catalog tools, mobile quick nav and admin UX.
   ====================================================================== */

.v10-public{
  --v10-ink:#17151f;
  --v10-muted:#727785;
  --v10-surface:#ffffff;
  --v10-line:rgba(30,25,58,.09);
  --v10-purple:#6952e8;
}

/* Header auth button */
.v10-public .nav-actions{align-items:center;gap:11px}
.v10-public .v10-login-button{
  min-height:46px;padding:0 15px 0 9px;border:1px solid rgba(42,35,77,.10);
  border-radius:15px;background:rgba(255,255,255,.92);display:inline-flex;align-items:center;gap:9px;
  color:#24212f!important;font-family:'Sora','Inter',sans-serif;font-size:11px!important;font-weight:700!important;
  box-shadow:0 8px 24px rgba(38,31,80,.065),inset 0 1px 0 #fff;
  transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease,color .2s ease;
}
.v10-public .v10-login-icon{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;background:#f1effb;color:#6952e8;font-size:13px;font-weight:900;transition:.2s ease}
.v10-public .v10-login-button:hover{transform:translateY(-2px);border-color:rgba(105,82,232,.22);box-shadow:0 14px 30px rgba(54,41,126,.11);color:#5b45d8!important}
.v10-public .v10-login-button:hover .v10-login-icon{background:linear-gradient(135deg,#6952e8,#8d61f3);color:#fff;box-shadow:0 8px 18px rgba(105,82,232,.20)}
.v10-public .v6-cart-button{min-height:48px!important;border-radius:15px!important;padding:0 20px!important;font-size:11px!important}
.v10-public .v10-utility-login{min-height:27px;padding:0 9px;border-radius:9px;display:inline-flex;align-items:center;gap:5px;background:#f5f3fd;color:#5f49d8!important;border:1px solid #e9e5fb;font-weight:800!important}.v10-public .v10-utility-login:hover{background:#ece8ff;color:#523bd0!important}.v10-public .v10-utility-login span{margin:0!important;color:inherit!important}

/* Platform brand identity */
.v10-public .v6-platform-card{
  background:
    radial-gradient(150px circle at 7% 12%,rgba(var(--brand-rgb),.115),transparent 70%),
    linear-gradient(145deg,#fff 0%,#fdfdff 65%,rgba(var(--brand-rgb),.035) 100%)!important;
  border-color:rgba(var(--brand-rgb),.12)!important;
}
.v10-public .v6-platform-card:hover{border-color:rgba(var(--brand-rgb),.30)!important;box-shadow:0 26px 60px rgba(var(--brand-rgb),.12),0 12px 35px rgba(34,27,76,.065)!important}
.v10-public .v6-platform-card .v6-platform-icon{background:linear-gradient(145deg,#fff,rgba(var(--brand-rgb),.07))!important;border-color:rgba(var(--brand-rgb),.10)!important}
.v10-public .v6-platform-card .v6-card-arrow{background:rgba(var(--brand-rgb),.09)!important;color:var(--brand)!important}
.v10-public .v6-platform-card.selected{border-color:rgba(var(--brand-rgb),.38)!important;box-shadow:0 18px 44px rgba(var(--brand-rgb),.12)!important}

/* Follow / subscriber sections: brand-tinted, only primary growth service packages */
.v10-public .v10-growth-section{
  position:relative;overflow:hidden;
  background:
    radial-gradient(900px circle at 7% 0%,rgba(var(--brand-rgb),.055),transparent 56%),
    linear-gradient(180deg,#fff,#fafafe)!important;
}
.v10-public .v10-growth-section.alt{background:radial-gradient(900px circle at 92% 8%,rgba(var(--brand-rgb),.055),transparent 54%),#fff!important}
.v10-public .v10-growth-section .v6-section-heading>div>span{color:var(--brand)!important}
.v10-public .v10-growth-section .v6-section-heading>a{color:var(--brand)!important}

/* Product cards: platform-specific colors and stable badge stacking */
.v10-public .v10-brand-card{
  overflow:hidden!important;
  border-color:rgba(var(--brand-rgb),.14)!important;
  background:
    radial-gradient(300px circle at var(--card-x,88%) var(--card-y,2%),rgba(var(--brand-rgb),.14),transparent 64%),
    linear-gradient(150deg,#fff 0%,#fefeff 56%,rgba(var(--brand-rgb),.045) 100%)!important;
  box-shadow:0 18px 52px rgba(31,28,60,.07),0 8px 24px rgba(var(--brand-rgb),.045),inset 0 1px 0 #fff!important;
}
.v10-public .v10-brand-card:hover{border-color:rgba(var(--brand-rgb),.32)!important;box-shadow:0 34px 90px rgba(var(--brand-rgb),.14),0 18px 45px rgba(32,28,65,.09)!important}
.v10-public .v10-brand-card.popular{border-color:rgba(var(--brand-rgb),.42)!important;box-shadow:0 28px 78px rgba(var(--brand-rgb),.15),inset 0 1px 0 #fff!important}
.v10-public .v10-brand-card .v6-product-brand>span{background:linear-gradient(145deg,#fff,rgba(var(--brand-rgb),.07))!important;border:1px solid rgba(var(--brand-rgb),.11)}
.v10-public .v10-brand-card .v6-product-brand small{color:var(--brand)!important}
.v10-public .v10-brand-card li::before{color:var(--brand)!important}
.v10-public .v10-brand-card .v6-product-bottom>a{
  background:linear-gradient(135deg,var(--brand-2),var(--brand))!important;
  box-shadow:0 14px 31px rgba(var(--brand-rgb),.25),inset 0 1px 0 rgba(255,255,255,.20)!important;
}
.v10-public .v10-brand-card .v6-product-bottom>a:hover{box-shadow:0 20px 42px rgba(var(--brand-rgb),.32)!important}
.v10-public .v10-brand-card .v6-product-bottom>div>strong{color:#17151f}

/* Popular badge: always above 3D layers, never hidden behind the logo. */
.v10-public .v10-brand-card .v6-popular-badge{
  position:absolute!important;top:19px!important;right:19px!important;left:auto!important;z-index:80!important;
  display:inline-flex;align-items:center;gap:5px;min-height:31px;padding:0 11px!important;
  border:1px solid rgba(255,255,255,.62);border-radius:999px;
  background:linear-gradient(135deg,var(--brand-2),var(--brand))!important;color:#fff!important;
  box-shadow:0 12px 27px rgba(var(--brand-rgb),.26),inset 0 1px 0 rgba(255,255,255,.28)!important;
  font-size:9px!important;font-weight:850!important;line-height:1!important;transform:translateZ(70px)!important;
  pointer-events:none;white-space:nowrap;
}
.v10-public .v10-brand-card .v6-popular-badge i{font-style:normal;font-size:10px;color:#ffe994}
.v10-public .v10-brand-card .v6-product-brand{padding-right:96px;min-height:52px}

/* Hero proof text cleanup */
.v10-public .v7-proof-row small{font-size:10px;color:#8b8f9c;line-height:1.4}

/* ----------------------------------------------------------------------
   Services catalog — search, filters, expanding package drawers
   ---------------------------------------------------------------------- */
.v10-public .v10-services-list{padding-top:46px;background:linear-gradient(180deg,#f7f8fb,#fbfbfd)}
.v10-public .v10-services-toolbar{margin-bottom:20px}
.v10-public .v10-services-toolbar p{font-size:11px;color:#8a8f9c;margin:8px 0 0}
.v10-catalog-tools{display:grid;grid-template-columns:minmax(280px,1fr) auto;gap:14px;align-items:center;margin:0 0 15px}
.v10-search-box{position:relative;display:flex;align-items:center;gap:10px;min-height:56px;padding:0 13px;border:1px solid #e2e4eb;border-radius:17px;background:#fff;box-shadow:0 9px 28px rgba(31,28,62,.045)}
.v10-search-box>span{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:#f2f0fb;color:#6952e8;font-weight:900}
.v10-search-box input{border:0!important;box-shadow:none!important;background:transparent!important;min-height:52px!important;padding:0!important;font-size:12px!important;flex:1}
.v10-search-box kbd{border:1px solid #e2e3e9;background:#f7f7fa;border-radius:8px;padding:5px 7px;font:700 9px/1 'Inter',sans-serif;color:#9095a1;box-shadow:inset 0 -1px 0 #dddfe6}
.v10-category-filters{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}
.v10-category-filters button{min-height:37px;padding:0 12px;border:1px solid #e2e3e9;border-radius:11px;background:#fff;color:#686d7a;font-size:9px;font-weight:800;transition:.17s ease}
.v10-category-filters button:hover{border-color:#cfc9f4;color:#5f49db}
.v10-category-filters button.active{border-color:transparent;color:#fff;background:linear-gradient(135deg,#1a1725,#6650df 70%,#8a5cec);box-shadow:0 9px 20px rgba(92,70,210,.18)}
.v10-results-line{display:flex;justify-content:space-between;align-items:center;margin:0 2px 14px;color:#8b909d;font-size:9px}.v10-results-line b{color:#292633;font-size:10px}.v10-results-line small{font-size:8px;color:#a0a4ae}

.v10-public .v10-service-list-grid{align-items:start;gap:14px}
.v10-public .v10-service-card{
  display:block!important;overflow:hidden;padding:0!important;border-radius:21px!important;
  border:1px solid rgba(var(--brand-rgb),.12)!important;
  background:radial-gradient(260px circle at 0 0,rgba(var(--brand-rgb),.07),transparent 72%),#fff!important;
  box-shadow:0 9px 29px rgba(31,28,62,.05)!important;
  transition:transform .23s ease,border-color .23s ease,box-shadow .23s ease!important;
  outline:none;
}
.v10-public .v10-service-card:hover,.v10-public .v10-service-card:focus-within,.v10-public .v10-service-card.is-open{
  transform:translateY(-4px)!important;border-color:rgba(var(--brand-rgb),.28)!important;
  box-shadow:0 24px 58px rgba(var(--brand-rgb),.11),0 11px 30px rgba(31,28,62,.07)!important;
}
.v10-service-summary{display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;padding:19px 19px 18px}
.v10-public .v10-service-card .v6-service-list-logo{width:58px;height:58px;border-radius:18px;background:linear-gradient(145deg,#fff,rgba(var(--brand-rgb),.07));border:1px solid rgba(var(--brand-rgb),.10);box-shadow:0 9px 24px rgba(var(--brand-rgb),.075)}
.v10-public .v10-service-card .v6-service-list-logo img{width:29px;height:29px}
.v10-public .v10-service-card .v6-service-list-copy small{color:var(--brand)!important;font-size:9px!important;letter-spacing:.06em}
.v10-public .v10-service-card .v6-service-list-copy h3{font-size:15px!important;margin:4px 0 6px;color:#1e1b27}
.v10-public .v10-service-card .v6-service-list-copy p{font-size:10.5px!important;line-height:1.45;color:#858a96;margin-bottom:7px}
.v10-public .v10-service-card .v6-service-list-copy>span{font-size:9px!important;color:var(--brand)!important;font-weight:800}
.v10-public .v10-service-card .v6-service-list-price{min-width:126px;border-left:1px solid rgba(var(--brand-rgb),.10);padding-left:17px}
.v10-public .v10-service-card .v6-service-list-price small{font-size:8px!important}.v10-public .v10-service-card .v6-service-list-price strong{font-size:20px!important;color:#1b1922}
.v10-package-toggle{border:0;min-height:36px;padding:0 11px;border-radius:11px;background:linear-gradient(135deg,var(--brand-2),var(--brand));color:#fff;font-size:9px;font-weight:850;box-shadow:0 9px 20px rgba(var(--brand-rgb),.19);display:inline-flex;align-items:center;gap:6px}
.v10-package-toggle span{transition:transform .22s ease}.v10-service-card.is-open .v10-package-toggle span,.v10-service-card:hover .v10-package-toggle span{transform:rotate(180deg)}
.v10-package-drawer{max-height:0;opacity:0;overflow:hidden;padding:0 19px;border-top:1px solid transparent;transition:max-height .36s cubic-bezier(.2,.75,.2,1),opacity .22s ease,padding .32s ease,border-color .22s ease;background:linear-gradient(180deg,rgba(var(--brand-rgb),.025),rgba(var(--brand-rgb),.055))}
.v10-service-card:hover .v10-package-drawer,.v10-service-card:focus-within .v10-package-drawer,.v10-service-card.is-open .v10-package-drawer{max-height:520px;opacity:1;padding:17px 19px 20px;border-top-color:rgba(var(--brand-rgb),.09)}
.v10-package-drawer-head{display:flex;align-items:end;justify-content:space-between;gap:14px;margin-bottom:12px}.v10-package-drawer-head small,.v10-package-drawer-head strong{display:block}.v10-package-drawer-head small{font-size:7px;color:var(--brand);font-weight:900;text-transform:uppercase}.v10-package-drawer-head strong{font:700 11px/1.3 'Sora','Inter',sans-serif;margin-top:3px}.v10-package-drawer-head>a{font-size:8px;color:var(--brand);font-weight:850}
.v10-package-chips{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.v10-package-chip{position:relative;display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:8px;min-height:60px;padding:9px 10px;border:1px solid rgba(var(--brand-rgb),.11);border-radius:13px;background:rgba(255,255,255,.85);box-shadow:0 6px 16px rgba(34,29,65,.035);transition:.18s ease}
.v10-package-chip:hover{transform:translateY(-2px);border-color:rgba(var(--brand-rgb),.28);box-shadow:0 12px 25px rgba(var(--brand-rgb),.10);background:#fff}
.v10-package-chip span{min-width:0}.v10-package-chip strong{display:inline;font-size:11px}.v10-package-chip small{font-size:7px;color:#8e939f;margin-left:3px}.v10-package-chip b{font-size:10px;color:var(--brand);white-space:nowrap}.v10-package-chip em{width:25px;height:25px;border-radius:8px;background:rgba(var(--brand-rgb),.09);color:var(--brand);display:grid;place-items:center;font-style:normal;font-size:10px}.v10-package-chip i{display:block;font-style:normal;font-size:6px;color:var(--brand);font-weight:900;margin-bottom:2px;text-transform:uppercase}.v10-package-chip.is-popular{border-color:rgba(var(--brand-rgb),.27);background:linear-gradient(145deg,#fff,rgba(var(--brand-rgb),.06))}
.v10-no-results{text-align:center;padding:65px 20px;border:1px dashed #dcdde5;border-radius:20px;background:#fff}.v10-no-results>span{width:50px;height:50px;border-radius:16px;display:grid;place-items:center;margin:auto;background:#f1effb;color:#6952e8;font-size:20px}.v10-no-results h3{font-size:15px;margin:12px 0 6px}.v10-no-results p{font-size:10px;color:#8b909d}.v10-no-results button{border:0;border-radius:11px;background:#eeeafd;color:#6049dc;font-size:9px;font-weight:850;padding:10px 13px}

/* Mobile quick navigation */
.v10-mobile-nav{display:none}

/* ----------------------------------------------------------------------
   Admin: categories + Popular shortcut
   ---------------------------------------------------------------------- */
.v10-admin-category-grid{display:grid;gap:9px;padding:0 18px 18px}
.v10-admin-category-card{display:grid;grid-template-columns:auto minmax(220px,1fr) 70px auto auto;align-items:center;gap:12px;padding:13px;border:1px solid #e8e9ef;border-radius:15px;background:#fff}
.v10-admin-category-card.is-off{opacity:.68;background:#fafafa}.v10-admin-category-icon{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:#ecfbf5;color:#13a86f;font-weight:900}.v10-admin-category-card.is-off .v10-admin-category-icon{background:#fff0f2;color:#d84a61}.v10-admin-category-copy{display:grid;gap:4px}.v10-admin-category-copy small{font-size:7px;color:#989da8;text-transform:uppercase;font-weight:800}.v10-admin-category-copy input{min-height:38px!important;font-weight:750}.v10-admin-category-copy span{font-size:7px;color:#8d929f}
.v10-service-admin-row{grid-template-columns:minmax(190px,1.2fr) minmax(180px,1fr) minmax(150px,.75fr) auto 64px auto auto auto!important}.v10-service-admin-row.category-disabled{background:#fff8f8;opacity:.72}.v10-admin-category-select{display:grid;gap:4px}.v10-admin-category-select>span{font-size:7px;color:#9196a2;font-weight:800}.v10-admin-category-select select{min-height:39px!important;font-size:8px!important;padding:0 8px}
.v10-package-admin-grid{overflow:visible}.v10-package-admin-card{position:relative;overflow:visible!important;border-color:rgba(var(--brand-rgb),.10)!important;background:linear-gradient(145deg,#fff,rgba(var(--brand-rgb),.025))!important}.v10-package-admin-card.is-popular{border-color:rgba(var(--brand-rgb),.32)!important;box-shadow:0 15px 35px rgba(var(--brand-rgb),.10)}
.v10-admin-popular-badge{position:absolute;top:-11px;left:14px;z-index:4;padding:6px 9px;border-radius:999px;background:linear-gradient(135deg,var(--brand-2),var(--brand));color:#fff;font-size:7px;font-weight:900;box-shadow:0 8px 18px rgba(var(--brand-rgb),.22)}
.v10-popular-control{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 10px;border-radius:11px;background:#f7f7fb;border:1px solid #ededf2}.v10-popular-control label{display:flex!important;align-items:center;gap:7px!important}.v10-popular-control input{width:15px!important;height:15px!important;min-height:auto!important}.v10-popular-control span{font-size:7px;font-weight:750;color:#5f6470}.v10-popular-shortcut{border:0;border-radius:8px;padding:7px 8px;background:#ebe8ff;color:#634bdc;font-size:7px;font-weight:850;white-space:nowrap}
.selected-service-bar[style]{border-color:rgba(var(--brand-rgb),.12);background:linear-gradient(145deg,#fff,rgba(var(--brand-rgb),.04))}

/* Better focus states */
.v10-public a:focus-visible,.v10-public button:focus-visible,.v10-public input:focus-visible{outline:3px solid rgba(105,82,232,.22);outline-offset:3px}

@media(max-width:1160px){
  .v10-package-chips{grid-template-columns:repeat(2,1fr)}
  .v10-service-admin-row{grid-template-columns:1fr 1fr!important}.v10-service-admin-row>*{min-width:0}
}
@media(max-width:900px){
  .v10-catalog-tools{grid-template-columns:1fr}.v10-category-filters{justify-content:flex-start}.v10-results-line small{display:none}
  .v10-public .v10-service-list-grid{grid-template-columns:1fr!important}
  .v10-admin-category-card{grid-template-columns:auto 1fr auto}.v10-admin-category-card .sort-input{grid-column:2}.v10-admin-category-card .btn{grid-column:3}
}
@media(max-width:720px){
  .v10-public{padding-bottom:76px}
  .v10-public .v10-brand-card .v6-popular-badge{top:15px!important;right:15px!important}.v10-public .v10-brand-card .v6-product-brand{padding-right:92px}
  .v10-service-summary{grid-template-columns:auto 1fr;padding:16px;gap:12px}.v10-public .v10-service-card .v6-service-list-price{grid-column:2;border-left:0;padding-left:0;text-align:left;display:flex;align-items:center;gap:8px}.v10-public .v10-service-card .v6-service-list-price small{display:none}.v10-public .v10-service-card .v6-service-list-price strong{margin:0}.v10-package-toggle{margin-left:auto}.v10-package-drawer-head{align-items:flex-start;flex-direction:column}
  .v10-mobile-nav{position:fixed;z-index:120;left:10px;right:10px;bottom:9px;height:64px;padding:6px;display:grid;grid-template-columns:repeat(5,1fr);align-items:center;border:1px solid rgba(38,31,76,.10);border-radius:20px;background:rgba(255,255,255,.92);backdrop-filter:blur(22px) saturate(160%);box-shadow:0 18px 60px rgba(30,25,65,.19),inset 0 1px 0 #fff}
  .v10-mobile-nav a{position:relative;height:50px;border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:#858a96}.v10-mobile-nav a>span{font-size:15px}.v10-mobile-nav a>small{font-size:7px;font-weight:800}.v10-mobile-nav a.active{color:#6049dd;background:#f1effd}.v10-mobile-nav .v10-mobile-order{height:58px;margin-top:-15px;background:linear-gradient(135deg,#191625,#6650df 65%,#8b5cf0);color:#fff!important;box-shadow:0 12px 26px rgba(91,69,211,.26)}.v10-mobile-nav .v10-mobile-order>span{font-size:21px}
}
@media(max-width:520px){
  .v10-search-box kbd{display:none}.v10-category-filters{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}.v10-category-filters::-webkit-scrollbar{display:none}.v10-category-filters button{white-space:nowrap}
  .v10-package-chips{grid-template-columns:1fr 1fr}.v10-package-chip{grid-template-columns:1fr auto;min-height:58px}.v10-package-chip em{display:none}
  .v10-public .v10-service-card .v6-service-list-copy p{display:none}
  .v10-public .v10-service-card .v6-service-list-logo{width:50px;height:50px}.v10-public .v10-service-card .v6-service-list-logo img{width:25px;height:25px}
  .v10-admin-category-card{grid-template-columns:auto 1fr}.v10-admin-category-card .switch,.v10-admin-category-card .btn{grid-column:auto}.v10-admin-category-card .sort-input{grid-column:2}
}

/* Order package selection inherits selected platform colors. */
.v10-public .order-section[style] .package-option>span{border-color:rgba(var(--brand-rgb),.12);background:linear-gradient(145deg,#fff,rgba(var(--brand-rgb),.025))}
.v10-public .order-section[style] .package-option input:checked+span{border-color:rgba(var(--brand-rgb),.48);background:linear-gradient(145deg,#fff,rgba(var(--brand-rgb),.075));box-shadow:0 0 0 3px rgba(var(--brand-rgb),.08),0 12px 28px rgba(var(--brand-rgb),.08)}
.v10-public .order-section[style] .package-option input:checked+span>i{border-color:var(--brand)}
.v10-public .order-section[style] .package-option b{color:var(--brand)}
.v10-order-popular{position:absolute;left:11px;top:9px!important;margin:0!important;padding:4px 6px;border-radius:999px;background:linear-gradient(135deg,var(--brand-2,#5d49dc),var(--brand,#7859ee));color:#fff!important;font-size:6px!important;font-weight:900!important;text-transform:none!important;letter-spacing:0!important;box-shadow:0 6px 14px rgba(var(--brand-rgb,105,82,232),.16)}
.package-option.is-popular>span{padding-top:27px}
.v10-shopier-label{font-size:6px!important;color:#6d5dfb!important}
.v10-public .v10-service-card[hidden]{display:none!important}

/* V10 final polish */
.v10-public .v10-login-button{line-height:1!important;white-space:nowrap;text-decoration:none!important}
.v10-public .v10-login-button span:last-child{display:block;opacity:1!important;visibility:visible!important;transform:none!important}
.v10-public .v10-utility-login{line-height:1!important;white-space:nowrap;opacity:1!important;visibility:visible!important}
.v10-public .v10-brand-card .v6-product-bottom>a{position:relative;z-index:12;isolation:isolate;color:#fff!important;font-size:12px!important;font-weight:850!important;min-width:128px!important;min-height:49px!important}
.v10-public .v10-brand-card .v6-product-bottom>a:before{content:'';position:absolute;inset:1px;border-radius:inherit;background:linear-gradient(110deg,rgba(255,255,255,.16),transparent 38%,rgba(255,255,255,.10) 65%,transparent);z-index:-1;pointer-events:none}
.v10-public .v10-brand-card .v6-product-bottom>a:hover{transform:translateY(-3px) scale(1.015)!important;color:#fff!important}
.v10-public .v10-brand-card .v6-product-bottom>a:active{transform:translateY(-1px) scale(.99)!important}
.v10-public .v10-brand-card .v6-product-brand>span{box-shadow:0 12px 28px rgba(var(--brand-rgb),.12)!important}
.v10-public .v10-service-card .v10-package-drawer{will-change:max-height,opacity}
