/* ========================================================
   Inline CSS merged from /resources/views/client/layouts/client.blade.php
   Order preserved as in the Blade template
   ======================================================== */

/* 1) Theme base token */
:root { --theme-default: #171621 }

/* 2) THEME giống "ĐƠN HÀNG ĐÃ MUA" (chỉ CSS) */
:root{
  --pri:#6d4cff; --pri2:#8b6bff;
  --ink:#0f172a; --muted:#64748b;
  --card:#fff; --soft:#fafaff; --line:#eef2f7;
  --ok:#16a34a; --warn:#f59e0b; --err:#ef4444;
}

/* Nền rất nhẹ */
body{ background:linear-gradient(180deg,#fbfbff, #f7f7ff 26%, #ffffff) }

/* Card & Header */
.card{
  border:1px solid var(--line) !important;
  border-radius:16px !important;
  background:var(--card) !important;
  box-shadow:0 10px 28px rgba(17,24,39,.06) !important;
}
.card-header{
  background:linear-gradient(135deg, rgba(109,76,255,.10), rgba(139,107,255,.06)) !important;
  border-bottom:1px solid var(--line) !important;
  border-top-left-radius:16px !important; border-top-right-radius:16px !important;
}
.card-title{
  margin:0; color:var(--ink); font-weight:800; letter-spacing:.3px;
  text-transform:uppercase;
}

/* Table (giống phần đơn hàng) */
.table thead th{
  background:linear-gradient(135deg, #f6f7ff, #ffffff) !important;
  color:#334155 !important; border-bottom:1px solid var(--line) !important;
}
.table td, .table th{ vertical-align:middle }
.table tbody tr{ transition:background .15s ease }
.table tbody tr:hover{ background:#fcfcff !important }

/* Badge (nhẹ nhàng, bo tròn) */
.badge{ border-radius:10px; padding:.38rem .6rem; font-weight:700 }
.bg-success{ background:rgba(22,163,74,.12) !important; color:#15803d !important }
.bg-primary{ background:rgba(109,76,255,.14) !important; color:var(--pri) !important }
.bg-warning{ background:rgba(245,158,11,.14) !important; color:#b45309 !important }
.bg-danger{ background:rgba(239,68,68,.14) !important; color:#b91c1c !important }

/* Nút đồng bộ phong cách */
.btn{ border-radius:12px !important }
.btn-outline-primary{
  border-color:var(--pri) !important; color:var(--pri) !important; background:#fff !important;
}
.btn-outline-primary:hover{
  background:var(--pri) !important; color:#fff !important;
  box-shadow:0 8px 18px rgba(109,76,255,.25);
}
.btn-primary{
  background:linear-gradient(135deg,var(--pri),var(--pri2)) !important;
  border-color:transparent !important;
  box-shadow:0 10px 24px rgba(109,76,255,.28);
}

/* Khối copy số TK, nội dung CK */
.copy-wrap{ display:inline-flex; align-items:center; gap:.5rem; vertical-align:middle }
.copy-wrap .mono{
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
  background:#f4f6ff; border:1px solid var(--line); color:var(--ink);
  padding:.35rem .6rem; border-radius:10px; line-height:1; display:inline-block;
}
.copy-wrap .btn{ padding:.25rem .5rem !important; border-radius:10px !important }

/* QR + ô nhập số tiền */
.qr-box img{
  border-radius:14px; border:1px solid var(--line);
  background:
    radial-gradient(120px 120px at 20% 20%, #f8f9ff, transparent 60%),
    radial-gradient(120px 120px at 80% 80%, #f4f6ff, transparent 60%), #fff;
  box-shadow:0 6px 20px rgba(15,23,42,.08);
}
.amount-input{
  border-radius:12px !important; background:var(--soft) !important;
  border:1px solid var(--line) !important; padding:.45rem .75rem !important;
}

/* Text & helper */
.text-muted{ color:var(--muted) !important }
.text-primary{ color:var(--pri) !important }
.text-success{ color:var(--ok) !important }
.text-danger{ color:var(--err) !important }

/* Pagination */
.page-link{ border-radius:10px !important }
.pagination .page-item.active .page-link{
  background:var(--pri) !important; border-color:var(--pri) !important;
}

/* Logo ngân hàng nhẹ bóng */
.card img[alt^="Logo"]{ filter: drop-shadow(0 4px 10px rgba(0,0,0,.06)) }

/* 3) Nút, form-select, sidebar (lam-only) */
.btn-outline-primary.active,
.btn-outline-primary:active,
.btn-outline-primary:focus,
.btn-outline-primary:hover {
  background-color: #171621 !important;
  border-color: #171621 !important;
  color: #fff
}
.btn-outline-primary {
  background-color: transparent;
  border-color: #171621;
  color: #171621
}
.ribbon-primary { background: #171621 }
.select2-container .select2-selection--single {
  border-color: var(--bs-border-color);
  border-radius: .95rem !important;
  height: 100% !important;
  padding: 10px
}
.form-select {
  --bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  display: block; width: 100%; padding: .505rem .75rem; font-size: 1rem; font-weight: 400; line-height: 1.5;
  color: var(--bs-body-color); background-color: var(--bs-body-bg);
  background-image: var(--bs-form-select-bg-img), var(--bs-form-select-bg-icon, none);
  background-repeat: no-repeat; background-position: right .75rem center; background-size: 16px 12px;
  border: var(--bs-border-width) solid var(--bs-border-color); border-radius: .95rem;
  transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out; -webkit-appearance: none; -moz-appearance: none; appearance: none
}
body.lam-only .notification-card .show-btn a,
body.lam-only .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper,
body.lam-only .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .logo-wrapper { background-color: #171818; }
body.lam-only .sidebar-toggle { stroke: #fff !important }
body.lam-only .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links .simplebar-wrapper .simplebar-mask .simplebar-content-wrapper .simplebar-content>li .mega-menu-container .mega-box .link-section .submenu-title h5,
body.lam-only .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links li a i { color: #fdfdfd; }
.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links .simplebar-wrapper .simplebar-mask .simplebar-content-wrapper .simplebar-content>li .sidebar-link.active {
  background-color: #2f2f34d4; border-radius: 10px; margin-bottom: 10px; position: relative; transition: all .5s ease
}
.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links .simplebar-wrapper .simplebar-mask .simplebar-content-wrapper .simplebar-content>li .sidebar-link:hover { background-color: #2f2f34d4; border-radius: 10px }

/* 4) Header nhỏ, pills, server grid, sticky panel, skeleton */
/* Header nhỏ + đường kẻ */
.svc-head{display:flex;align-items:center;gap:.5rem;margin-bottom:.4rem}
.svc-head__title{font-weight:600;font-size:.9rem;color:#374151;white-space:nowrap}
.svc-head__line{flex:1;height:1px;background:linear-gradient(90deg,#e5e7eb,transparent)}

/* Hàng tiêu đề: chip | tên (1 dòng) */
.svc-title{ display:flex;align-items:center;gap:.5rem; padding:.45rem .65rem;border:1px solid #eef1f6;border-radius:10px;background:#fff; }
.svc-chip{ font-size:.75rem;font-weight:600;color:#0d6efd;background:rgba(13,110,253,.08); border:1px solid rgba(13,110,253,.18);border-radius:999px;padding:.12rem .5rem;white-space:nowrap }
.svc-bar{color:#9ca3af;user-select:none}
.svc-name{ flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; font-weight:700;color:#111827 }

/* Divider mảnh giữa các nhóm */
.svc-divider{height:1px;background:linear-gradient(90deg,#f0f2f7,#eaeef5,#f0f2f7);margin:.25rem 0}

/* Mô tả */
.sv-desc{color:#4b5563;line-height:1.55}

/* Tiêu đề trong alert */
.section-head{display:flex;align-items:center;gap:.5rem;margin-bottom:.35rem}
.section-head>span:first-child{font-weight:600;color:#991b1b}
.section-line{flex:1;height:1px;background:linear-gradient(90deg,#ffdede,transparent)}

:root{ --brand:#0d6efd; --brand-soft: rgba(13,110,253,.12); --text:#1f2937; --muted:#6b7280; --ring:rgba(13,110,253,.25); --card:#ffffff; --bg:#f7f9fc; --shadow:0 10px 20px rgba(0,0,0,.06); --radius:16px; }
body{background:var(--bg);} .card{border:0;border-radius:var(--radius);box-shadow:var(--shadow);} .card-header{background:linear-gradient(180deg,#fff, #fafbff);border-bottom:1px solid #eef1f6;border-top-left-radius:var(--radius);border-top-right-radius:var(--radius);} .h6,.card-title{color:var(--text);} 

/* Platform pills */
.pill-row{display:flex;gap:.6rem;overflow:auto;padding:.25rem .1rem .5rem .1rem;scrollbar-width:none;}
.pill-row::-webkit-scrollbar{display:none;}
.pf-pill{display:flex;align-items:center;gap:.5rem;padding:.5rem .7rem;border:1px solid #e5e7eb;border-radius:999px;background:#fff;white-space:nowrap;text-decoration:none;transition:.18s;box-shadow:0 1px 0 rgba(0,0,0,.03);} .pf-pill:hover{transform:translateY(-1px);border-color:#dbe1ea} .pf-pill.active{border-color:var(--brand); box-shadow:0 0 0 .14rem var(--brand-soft);} .pf-pill img{width:20px;height:20px;object-fit:cover;border-radius:6px}

/* Server tiles using Bootstrap btn-check */
.server-grid{display:grid;grid-template-columns:repeat(1,minmax(0,1fr));gap:.6rem}
@media (min-width:768px){ .server-grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
.btn-check{position:absolute;inset:0;opacity:0}
.server-tile{width:100%; text-align:left; border:1px solid #e5e7eb; border-radius:12px; padding:.75rem .9rem; background:#fff; display:flex;align-items:center;gap:.6rem; transition:.18s; cursor:pointer}
.server-tile:hover{transform:translateY(-1px);border-color:#dbe1ea;box-shadow:0 6px 14px rgba(0,0,0,.05)}
.server-tile .code{font-weight:700;color:#111827}
.server-tile .name{flex:1;color:#374151}
.server-tile .price{font-weight:700;color:#dc2626;background:#fff5f5;border-radius:999px;padding:.2rem .55rem;border:1px solid #fee2e2}
.server-tile .badge-state{border-radius:999px}
.btn-check:checked + .server-tile{border-color:var(--brand); box-shadow:0 0 0 .18rem var(--brand-soft)}
.form-check-input[type="radio"]{accent-color:var(--brand)}
.form-check-input[type="radio"]:checked{background-color:var(--brand);border-color:var(--brand);box-shadow:0 0 0 .2rem var(--ring)}
.form-check-input[type="radio"]:focus{border-color:#86b7fe;box-shadow:0 0 0 .2rem var(--ring)}

/* Sticky right panel */
.sticky-side{position:sticky;top:90px}
.stat{display:flex;flex-direction:column;gap:.2rem}
.stat small{color:var(--muted)}
#sv_desc{color:#4b5563;line-height:1.55}

/* Field helpers */
.form-label{color:#374151}
.input-group .btn{border-top-left-radius:8px;border-bottom-left-radius:8px}
.form-control,.form-select{border-radius:10px}
.alert-light-danger{background:#fff7f7;border:1px solid #ffe4e4}
.table{border-radius:12px;overflow:hidden}

/* Skeleton */
.skeleton{background-image:linear-gradient(90deg,#f2f4f7 0px,#f7f9fc 40px,#f2f4f7 80px);background-size:600px;animation:skele 1.2s infinite linear}
@keyframes skele{0%{background-position:-100px}100%{background-position:400px}}
.server-skeleton{height:54px;border-radius:12px}

/* ===== KÍCH THƯỚC ICON SIDEBAR (SVG) ===== */
:root{ --sb-icon-size: 26px; }
.sidebar-links a svg,
.sidebar-links .sidebar-title svg,
.sidebar-links li > a svg{ width: var(--sb-icon-size) !important; height: var(--sb-icon-size) !important; flex: 0 0 var(--sb-icon-size); display: inline-block; vertical-align: middle; }
.sidebar-links .sidebar-link,
.sidebar-links .sidebar-title{ padding: 12px 14px !important; gap: 12px !important; }
.sidebar-links img.ph-duotone{ width: var(--sb-icon-size) !important; height: var(--sb-icon-size) !important; flex: 0 0 var(--sb-icon-size); }

/* 5) SIDEBAR THEME (dark navy + active viền xanh) */
:root{
  --sb-bg-top:#0f1a2d;
  --sb-bg-bot:#0b1423;
  --sb-text:#d8dee9;
  --sb-muted:#98a2b3;
  --sb-icon-bg:#18243e;
  --sb-icon-ring:rgba(255,255,255,.06);
  --sb-outline:#365cff;
  --sb-outline-soft:rgba(54,92,255,.14);
  --sb-hover:rgba(255,255,255,.06);
  --sb-radius:12px;
}
.page-wrapper .sidebar-wrapper{ background:linear-gradient(180deg,var(--sb-bg-top),var(--sb-bg-bot)) !important; border-right:1px solid rgba(255,255,255,.04); }
.page-wrapper .sidebar-wrapper .logo-wrapper{ background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.02)); margin:10px; padding:12px; border-radius:14px; }
.page-wrapper .sidebar-wrapper .logo-wrapper .toggle-sidebar .sidebar-toggle{ stroke:#fff !important }
.sidebar-main{ padding:10px 10px 16px }
#sidebar-menu{ padding:6px 6px 12px }
.sidebar-links{ display:flex; flex-direction:column; gap:10px }
.sidebar-links>li{ margin:0 }
.sidebar-main-title h6{ color:var(--sb-muted) !important; font-weight:700; letter-spacing:.25px; margin:6px 12px 0; text-transform:uppercase; font-size:.78rem; }
.sidebar-links .sidebar-link,
.sidebar-links .sidebar-title,
.sidebar-links .sidebar-link .link-nav{ display:flex; align-items:center; gap:.75rem; padding:10px 12px; border-radius:var(--sb-radius); color:var(--sb-text) !important; text-decoration:none; border:1px solid transparent; transition:.18s ease; line-height:1.2; background:transparent; }
.sidebar-links .sidebar-link i,
.sidebar-links .sidebar-link svg,
.sidebar-links .sidebar-title i,
.sidebar-links .sidebar-title svg{ width:18px; height:18px; padding:6px; border-radius:10px; background:var(--sb-icon-bg); box-shadow: inset 0 0 0 1px var(--sb-icon-ring); color:currentColor; fill:currentColor !important; stroke:currentColor !important; }
.sidebar-links .sidebar-link .text-white,
.sidebar-links .sidebar-title .text-white{ color:inherit !important }
.sidebar-links .sidebar-link:hover,
.sidebar-links .sidebar-title:hover{ background:var(--sb-hover); color:#fff; }
.sidebar-links .active>.sidebar-link,
.sidebar-links .active>.sidebar-title,
.sidebar-links .sidebar-link.active,
.sidebar-links .sidebar-title.active,
.sidebar-links li.is-active>.sidebar-link,
.sidebar-links li.is-active>.sidebar-title{ border-color:var(--sb-outline); background:var(--sb-outline-soft); color:#fff !important; box-shadow:0 0 0 2px rgba(54,92,255,.18); }
.sidebar-links .active>.sidebar-link svg,
.sidebar-links .sidebar-link.active svg{ background:rgba(54,92,255,.18); box-shadow:inset 0 0 0 1px rgba(255,255,255,.15); }
.sidebar-submenu{ margin:6px 0 0 46px; padding:0; list-style:none }
.sidebar-submenu a{ display:block; padding:8px 10px; border-radius:10px; color:var(--sb-text); text-decoration:none; border:1px solid transparent; }
.sidebar-submenu a:hover{ background:var(--sb-hover); color:#fff }
.sidebar-submenu a.active{ border-color:var(--sb-outline); background:var(--sb-outline-soft); color:#fff; }
.sidebar-links img.ph-duotone{ width:20px; height:20px; padding:6px; border-radius:10px; background:var(--sb-icon-bg); box-shadow: inset 0 0 0 1px var(--sb-icon-ring); object-fit:cover; }
.left-arrow,.right-arrow{ display:none !important }
@media(max-width: 991.98px){ .page-wrapper .sidebar-wrapper .logo-wrapper{ border-radius:0 } }

/* 6) Chat launcher (toggle + chat box) */
#toggle-chat { position: fixed; bottom: 20px; right: 20px; width: 60px; height: 60px; background-color: white; border-radius: 50%; display: flex; justify-content: center; align-items: center; cursor: pointer; z-index: 9999; box-shadow: 0 4px 10px rgba(0,0,0,0.2); }
#toggle-chat img { width: 36px; height: 36px; pointer-events: none; }
#telegram-chat-box { opacity: 0; pointer-events: none; transition: opacity 0.3s ease; width: 300px; padding: 20px; border-radius: 12px; background: white; box-shadow: 0 10px 25px rgba(0,0,0,0.2); position: fixed; bottom: 140px; right: 20px; z-index: 9998; font-family: 'Segoe UI', sans-serif; }
#telegram-chat-box.show { opacity: 1; pointer-events: auto; }
#telegram-chat-box h3 { margin-top: 0; color: #0088cc; }
#telegram-chat-box input,
#telegram-chat-box textarea { width: 100%; padding: 10px; margin-top: 8px; border: 1px solid #ccc; border-radius: 8px; font-size: 14px; }
#telegram-chat-box button { margin-top: 10px; width: 100%; padding: 10px; background: #0088cc; color: white; border: none; border-radius: 8px; font-size: 16px; cursor: pointer; }

/* 7) Poppins + coupon container + misc (radio color + dynamic brand) */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/poppins/v23/pxiEyp8kv8JHgFVrJJfedw.ttf) format('truetype');
}
@media screen and (max-width: 812px) {
  #sm-coupon-container { position: fixed; bottom: -6000px; z-index: 2147483647; -webkit-transition: all 0.8s; -moz-transition: all 0.8s; -o-transition: all 0.8s; transition: all 0.8s; }
  #sm-coupon-container.sm-animate-visible { bottom: 0; }
  #sm-coupon-container.sm-centered { bottom: 0; }
  #sm-coupon-container .sm-coupon-wrapper { background-color: #ffffff; border-radius: 15px; width: 100vw; }
  #sm-coupon-container .sm-header { margin: 0px; padding: 0px; border-bottom: 1px solid #eee; }
  #sm-coupon-container .sm-header .sm-logo1 { margin: 7px 5px 0 5px; cursor: pointer; }
  #sm-coupon-container .sm-header img.sm-logo1 { width: 80px; }
  #sm-coupon-container .sm-header .sm-cross-icon { float: right; cursor: pointer; margin-top: 7px; margin-right: 5px; }
  #sm-coupon-container .sm-header .sm-cross-icon img { margin: 10px 14px; width: 11px; }
  #sm-coupon-container .sm-activation-button { font-size: 18px; text-align: center; min-width: 70%; padding: 0 5px; line-height: 40px; border-radius: 5px; }
  #sm-coupon-container .sm-activation-button :hover { font-size: 22px; min-width: 85%; }
  #sm-coupon-container .sm-activation-button img { height: 15px; }
  #sm-coupon-container .sm-support a { font-size: 8px !important; }
  #sm-coupon-container .sm-coupon-codes { width: 100%; margin-top: 0; margin-bottom: 5px; }
  #sm-coupon-container .sm-valid-codes { overflow: hidden; height: 56px; }
  #sm-coupon-container #exclusions-text { font-family: Verdana; font-size: 8pt; bottom: 40px; background-color: #eeeeee; color: #333333; padding: 5px 20px; border-radius: 5px; }
  #sm-coupon-container h1 { font-size: 20px; }
  #sm-coupon-container h2 { font-size: 18px; }
  #sm-coupon-container h3 { font-size: 15px; }
  #sm-coupon-container h4 { font-size: 12px; }
  #sm-coupon-container h5 { font-size: 10px; }
  #sm-coupon-container h6 { font-size: 10.2px; }
}
@media screen and (min-width: 813px) {
  #sm-coupon-container { position: fixed; z-index: 2147483647; top: -8px; right: -3600px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; }
  #sm-coupon-container.sm-animate-visible { right: 0; }
  #sm-coupon-container.sm-centered { right: calc(50vw - 325px); top: calc(50vh - 240px); }
  #sm-coupon-container .sm-coupon-wrapper { width: 374px; }
  #sm-coupon-container .sm-header { margin: 0px; padding: 0 15px; }
  #sm-coupon-container .sm-header .sm-logo1 { margin: 10px; cursor: pointer; }
  #sm-coupon-container .sm-header .sm-cross-icon { float: right; margin-top: 11px; cursor: pointer; }
  #sm-coupon-container .sm-activation-button { font-size: 20px; text-align: center; min-width: 70%; padding: 0 5px; line-height: 45px; border-radius: 5px; }
  #sm-coupon-container .sm-activation-button :hover { font-size: 22px; min-width: 85%; }
  #sm-coupon-container .sm-activation-button img { height: 15px; }
  #sm-coupon-container .sm-coupon-codes { width: 100%; margin-top: 0; margin-bottom: 5px; padding-left: 15px; padding-right: 15px; }
  #sm-coupon-container .sm-valid-codes { overflow: hidden; height: 62px; }
  #sm-coupon-container #exclusions-text { font-family: Verdana; font-size: 8pt; margin-left: 15px; position: absolute; bottom: 40px; width: 300px; background-color: #eeeeee; color: #333333; padding: 20px; border-radius: 10px; }
  #sm-coupon-container h1 { font-size: 25px; }
  #sm-coupon-container h2 { font-size: 20px; }
  #sm-coupon-container h3 { font-size: 18px !important; text-align: center !important; }
  #sm-coupon-container h4 { font-size: 15px; }
  #sm-coupon-container h5 { font-size: 12px; }
  #sm-coupon-container h6 { font-size: 10.2px; }
}
#sm-coupon-container.no-transition { -webkit-transition: none; -moz-transition: none; -o-transition: none; transition: none; }
#sm-coupon-container span#checkedCoupons, #sm-coupon-container span#totalCoupons { font-size: inherit; }
#sm-coupon-container .sm-coupon-wrapper { background-color: #ffffff; border-radius: 5px; margin-top: 0px; margin-right: 15px; margin-top: 25px; }
#sm-coupon-container a, #sm-coupon-container a:hover { text-decoration: none; cursor: pointer; }
#sm-coupon-container .sm-activation-button { display: inline-block; background-color: #6d6fd5 !important; color: #fff; cursor: pointer; -webkit-transition: 0.05s; transition: 0.05s; transition-timing-function: ease-in-out; }
#sm-coupon-container #sm-style-4::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); background-color: #F5F5F5; }
#sm-coupon-container #sm-style-4::-webkit-scrollbar { width: 4px; background-color: #999999; }
#sm-coupon-container #sm-style-4::-webkit-scrollbar-thumb { background-color: #999999; border: 2px solid #999999; }
#sm-coupon-container .sm-margin0 { margin: 0px; }
#sm-coupon-container .sm-coupons { background-color: #fff; padding: 0px 10px; width: 100%; text-align: center; text-transform: none; }
#sm-coupon-container .sm-best-coupons { background-color: #6d6fd5 !important; display: inline-block; padding: 0 55px; line-height: 49px; color: #fff !important; font-size: 18px; cursor: pointer; text-align: center; border-radius: 5px; }
#sm-coupon-container .sm-claim { background-color: #6d6fd5 !important; display: inline-block; padding: 0 55px; line-height: 49px; color: #fff !important; font-size: 18px; cursor: pointer; text-align: center; border-radius: 5px; }
#sm-coupon-container .sm-invalid-codes { width: initial; }
#sm-coupon-container .sm-support { float: left; margin-right: 15px; width: initial; }
#sm-coupon-container .sm-support .sm-icon { float: left; height: 20px; margin-bottom: 5px; width: 100%; }
#sm-coupon-container .sm-support .sm-invalid { transition: margin 0.1s; -webkit-transition: margin 0.1s; float: none; }
#sm-coupon-container .sm-support .sm-valid { margin: 5px; transition: margin 0.1s; -webkit-transition: margin 0.1s; }
#sm-coupon-container .sm-support a { width: 100%; background-color: #e8e8e8 !important; color: #6d6fd5 !important; padding: 10px 8px; font-size: 11px; letter-spacing: 0.35px; font-weight: 700; border-radius: 5px; min-width: 100px; text-align: center; transition: all 0.4s; -webkit-transition: all 0.4s; }
#sm-coupon-container .sm-coupon-invalid { background-color: #fff !important; width: 100%; opacity: 0.3; border: solid 1px #e8e8e8; color: #5e5e5e; padding: 2px 0px; font-size: 11px; font-weight: bold; border-radius: 5px; }
#sm-coupon-container .sm-progress-bar { float: left; width: 0; height: 100%; font-size: 12px; line-height: 20px; color: #fff; text-align: center; background-color: #6d6fd5; -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15); box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15); -webkit-transition: width 0.6s ease; -o-transition: width 0.6s ease; transition: width 0.6s ease; }
#sm-coupon-container .sm-progress { height: 7px; margin-bottom: 14px; overflow: hidden; background-color: #f5f5f5; border-radius: 4px; -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); }
#sm-coupon-container .sm-not-working { position: absolute; bottom: 10px; width: 374px; right: 25px; text-align: center; }
#sm-coupon-container .sm-not-working a { text-transform: none; color: #6d6fd5; }
#sm-coupon-container .sm-error-img { margin-top: 20px; margin-left: auto; margin-right: auto; display: block; }
#sm-coupon-container .sm-error { font-size: 14px; margin-top: 30px; text-align: left; padding-left: 10px; padding-right: 10px; }
#sm-coupon-container .sm-error ul { text-align: left; margin-bottom: 30px; padding-left: 20px; list-style-type: disc !important; }
#sm-coupon-container .sm-error ul li { font-size: 14px; }
#sm-coupon-container .sm-content { font-size: 16px !important; margin: 20px; text-align: center; }
#sm-coupon-container .sm-content a.sm-visit { background-color: #6d6fd5 !important; display: inline-block; padding: 0 55px; line-height: 49px; color: #fff !important; font-size: 18px; cursor: pointer; text-align: center; border-radius: 5px; }
#sm-coupon-container .sm-primary, #sm-coupon-container .sm-button { background-color: #6d6fd5; width: 100%; line-height: 49px; color: #fff; font-size: 18px; cursor: pointer; text-align: center; padding: 9px 15px; border-radius: 5px; }
#sm-coupon-container .sm-activate-later { font-size: 14px !important; font-weight: 600; color: #252d6a; }
#sm-coupon-container .sm-coupon { display: inline !important; background-color: #e8e8e8 !important; color: #6d6fd5 !important; padding: 10px 20px !important; font-size: 15px !important; letter-spacing: 0.35px !important; font-weight: 700 !important; border-radius: 5px !important; min-width: 100px !important; text-align: center !important; }
#sm-coupon-container .sm-share-coupon { background-color: #6d6fd5 !important; width: 100% !important; line-height: 49px !important; color: #fff !important; font-size: 15px !important; cursor: pointer !important; text-align: center !important; padding: 9px 15px !important; border-radius: 5px !important; }
#sm-coupon-container .sm-working-coupon { color: #252d6a; font-size: 13px; font-weight: 600; text-transform: uppercase; border-radius: 5px; }
#sm-coupon-container .sm-congrats { color: #f5a80c; font-size: 27px; font-weight: 600; text-align: center; line-height: 40px; }
#sm-coupon-container .sm-green { color: #00c57d; font-weight: 700; font-size: 20px; }
#sm-coupon-container .sm-success-btn { padding: 10px; height: 42px; overflow: hidden; background-color: transparent; border-color: #6d6fd5 !important; border-radius: 5px; border-style: solid; border-width: 1px; color: #6d6fd5; font-weight: bold !important; font-size: 15px !important; cursor: pointer; }
#sm-coupon-container .sm-button-disabled { padding: 10px; height: 42px; overflow: hidden; background-color: transparent; border-radius: 5px; border-style: solid; border-width: 1px; color: #aaa; font-weight: bold !important; font-size: 15px !important; cursor: pointer; }
#sm-coupon-container .sm-review { background: #6d6fd5; color: #fff; width: 185px; margin: auto; }
#sm-coupon-container .sm-logo { justify-self: start; padding: 10px 20px; cursor: pointer; }
#sm-coupon-container .sm-close { margin: 5px 10px; justify-self: end; align-self: start; cursor: pointer; }
#sm-coupon-container .exclusions { text-align: center; }
#sm-coupon-container #exclusions-button { font-weight: 600; font-size: 9pt; cursor: pointer; }
#sm-coupon-container .exclusions-hidden { display: none; }
#sm-coupon-container .sm-code { color: #6d6fd5; }
#sm-coupon-container .sm-copy { border: 1px solid #f5a80c; background: #ffc954; }
#sm-coupon-container .sm-coupon-list::-webkit-scrollbar-thumb { background-color: #6d6fd5; }
#sm-coupon-container .sm-go { background-color: #f5a80c; color: #FFF; }
#sm-coupon-container .span-all { grid-column: 1 / span 2; }
#sm-coupon-container .sm-save { font-size: 13pt; font-weight: 800; color: #252d6a; margin-bottom: 15px; }
#sm-coupon-container .sm-price-redirect { cursor: pointer; }
#sm-coupon-container .sm-refer-email { padding: 10px; height: 35px; width: 175px; border-color: #949393 !important; border-radius: 8px 0px 0px 8px; border-style: solid; border-width: 1px; outline: none; font-size: 14px !important; }
#sm-coupon-container .sm-refer-submit { padding: 5px 7px 7px 8px; height: 32px; overflow: hidden; background-color: #6d6fd5; border-color: #6d6fd5 !important; border-radius: 0px 8px 8px 0px; border-style: solid; border-width: 1px; color: #fff; font-size: 15px !important; cursor: pointer; }
#sm-coupon-container .sm-refer-btn { margin: auto; padding: 6px; height: 38px; width: 180px; overflow: hidden; background-color: transparent; border-color: #6d6fd5 !important; border-radius: 5px; border-style: solid; border-width: 1px; color: #6d6fd5; font-size: 15px !important; font-weight: bold; cursor: pointer; }
#sm-coupon-container .sm-referral-msg { font-size: 14px !important; margin: 5px; font-weight: 500; height: 40px; }
#sm-coupon-container .sm-referral-success { color: #00c57d; }
#sm-coupon-container .sm-referral-error { color: #ff0000; }
#sm-coupon-container .sm-exclusions { padding: 10px 0px; color: #716f6f; font-size: 14px; }
#sm-coupon-container .sm-small-link { text-decoration: underline; color: #252d6a; font-size: 8pt; cursor: pointer; }
#sm-inline-content { all: initial; }
#sm-inline-content .sm-searching-button { display: inline-block; padding: 3px 12px; border-radius: 5px; border: 2px solid #ccc; color: #888; font-family: Poppins; font-size: 11pt; font-weight: bold; margin: 5px 0; padding-top: 5px; height: 22px; }
#sm-inline-content .sm-found-button { display: inline-block; padding: 3px 12px; border-radius: 5px; background-color: #6d6fd5; color: #ffffff; border: initial; font-family: Poppins; font-size: 11pt; font-weight: bold; margin: 5px 0; padding-top: 5px; height: 25px; cursor: pointer; }
#sm-inline-content .sm-img { vertical-align: middle; height: 20px; margin-right: 5px; }
#sm-inline-content .sm-loading { vertical-align: middle; height: 8px; }
#sm-full-loader { position: fixed; z-index: 2147483646; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; background-color: black; opacity: 0.7; }
.bg-facebook { background-color: #3c579e; }
.bg-google { background-color: #4285f4; }
.bg-microsoft { background-color: #2f2f2f; }
.bg-apple { background-color: #000000; }
.form-check-input[type="radio"]{ accent-color:#0d6efd; }
:root{ --brand: {{ $platform->color ?? '#0d6efd' }}; }