/* =========================================================
   MAWARTOTO ROCKET OVERLAY
   Disamakan dengan tema merah-kuning-hitam
========================================================= */

:root{
    --duration: 6.5s;
}

/* overlay roket */
.rocket-overlay{
    position:fixed;
    inset:0;
    overflow:hidden;
    pointer-events:none;
    z-index:9999;
}

/* jalur terbang */
.flight-path{
    position:absolute;
    bottom:-140px;
    will-change:transform;
    animation:moveRocket var(--duration) linear infinite;
}

/* posisi 3 roket */
.flight-path.rocket-1{
    left:20%;
}

.flight-path.rocket-2{
    left:50%;
    transform:translateX(-50%);
}

.flight-path.rocket-3{
    left:80%;
    transform:translateX(-100%);
}

/* box roket */
.rocket-box{
    display:flex;
    flex-direction:column;
    align-items:center;
    backface-visibility:hidden;
    filter:
        drop-shadow(0 0 0 #000)
        drop-shadow(0 0 8px rgba(255, 0, 0, .45))
        drop-shadow(0 0 14px rgba(255, 225, 0, .18));
}

/* gambar roket */
.rocket-img{
    width:80px;
    height:auto;
    display:block;
    animation:vibration .08s linear infinite;
}

/* api roket - gaya Mawartoto */
.flame{
    width:20px;
    height:62px;
    margin-top:-6px;
    position:relative;

    background:linear-gradient(
        to bottom,
        #fff 0%,
        #ff5a00 35%,
        #ff1717 68%,
        rgba(164, 0, 0, 0.2) 100%
    );

    border-left:3px solid #000;
    border-right:3px solid #000;
    border-bottom:3px solid #000;
    border-radius:0 0 18px 18px;

    box-shadow:
        0 0 0 1px #2a2a2a,
        0 6px 12px rgba(0,0,0,.45),
        0 0 14px rgba(255, 225, 0, .35),
        0 0 24px rgba(255, 23, 23, .22);

    opacity:.95;
    animation:mawartotoFlame .18s ease-in-out infinite alternate;
}

/* inti api */
.flame::before{
    content:"";
    position:absolute;
    left:50%;
    top:4px;
    transform:translateX(-50%);
    width:8px;
    height:38px;
    background:linear-gradient(
        to bottom,
        #fff7a8 0%,
        #fff 35%,
        #ff8a00 100%
    );
    border-radius:0 0 12px 12px;
    opacity:.95;
}

/* glow luar */
.flame::after{
    content:"";
    position:absolute;
    left:50%;
    bottom:-4px;
    transform:translateX(-50%);
    width:28px;
    height:30px;
    background:radial-gradient(
        ellipse at center,
        rgba(255,225,0,.45) 0%,
        rgba(255,23,23,.28) 45%,
        rgba(255,23,23,0) 100%
    );
    filter:blur(4px);
    pointer-events:none;
}

/* animasi api */
@keyframes mawartotoFlame{
    0%{
        height:56px;
        width:18px;
        transform:scaleY(1);
    }
    50%{
        height:64px;
        width:21px;
        transform:scaleY(1.05);
    }
    100%{
        height:58px;
        width:19px;
        transform:scaleY(.98);
    }
}

       
		/* =========================================================
   MAWARTOTO GLOBAL FORCE THEME - FIX ANTI TERPOTONG
   GANTI CSS LAMA DENGAN YANG INI
========================================================= */

/* =========================
   ROOT
========================= */
html,
body{
    margin:0 !important;
    padding:0 !important;
    background:#0a0a0a !important;
    color:#fff !important;
}

html *{
    box-sizing:border-box;
}

/* typography global agar teks tidak kepotong */
body,
body p,
body span,
body div,
body li,
body td,
body th,
body label,
body strong,
body small,
body a{
    color:inherit;
    line-height:1.45 !important;
    overflow-wrap:break-word;
    word-break:break-word;
}

/* warna teks global */
body{
    color:#fff !important;
    font-size:16px;
}

/* link */
a{
    color:#ffd400 !important;
    text-decoration:none !important;
}
a:hover{
    color:#fff000 !important;
    text-decoration:none !important;
}

/* cegah teks tersembunyi */
.page-wrapper,
.page-main,
.columns,
.column.main,
.sidebar,
.block,
.block-content,
.product-item,
.product-item-info,
.product-item-details,
.product-info-main,
.product-add-form,
.toolbar,
.toolbar-products,
.breadcrumbs,
.navigation,
.nav-sections,
.header.content,
.footer.content,
.cms-content,
.category-products,
.cart-container,
.checkout-container,
.modal-inner-wrap,
.popup,
.message,
.notice,
.page-title-wrapper{
    overflow:visible !important;
    min-width:0;
}

/* =========================
   PANEL / CONTAINER
========================= */
/* hanya panel utama, JANGAN semua div/li */
section,
article,
.card,
.box,
.content,
.wrapper,
.block,
.panel,
.container,
.sidebar,
.product-item-info,
.product-info-main,
.product-add-form,
.block-content,
.cms-content,
.category-products,
.cart-container,
.checkout-container,
.toolbar,
.toolbar-products,
.breadcrumbs,
.filter,
.filter-options,
.filter-options-item,
.block.filter,
.modal-inner-wrap{
    background:#111 !important;
    border:3px solid #000 !important;
    box-shadow:
        0 0 0 1px #2a2a2a,
        0 5px 15px rgba(0,0,0,.5) !important;
    border-radius:0 !important;
}

/* wrapper utama */
.page-wrapper,
.page-main,
.columns,
.column.main,
.sidebar,
.header,
.footer,
.page-header,
.page-footer,
.nav-sections,
.navigation,
.panel.wrapper,
.header.content,
.footer.content{
    background:#0a0a0a !important;
    color:#fff !important;
}

/* =========================
   HEADER
========================= */
header,
.page-header,
.header.content,
.header.panel,
.panel.wrapper{
    background:#120000 !important;
    border-bottom:4px solid #ff0000 !important;
}

.nav-sections,
.navigation{
    background:#120000 !important;
}

.navigation ul,
.navigation ol{
    background:transparent !important;
}

.navigation li{
    background:transparent !important;
}

.navigation a,
.nav-sections a,
.page-header a,
header a{
    color:#ffd400 !important;
    font-weight:900 !important;
    text-transform:uppercase;
    line-height:1.3 !important;
    display:inline-block;
    padding:8px 10px;
    white-space:normal !important;
}

/* =========================
   FOOTER
========================= */
footer,
.page-footer,
.footer.content{
    background:#120000 !important;
    border-top:4px solid #ff0000 !important;
    color:#fff !important;
}

/* =========================
   HEADING
========================= */
h1,
h2,
h3,
h4,
h5,
h6,
.page-title,
.product.name,
.product-item-name,
.block-title,
.legend{
    color:#ffd400 !important;
    font-weight:900 !important;
    text-transform:uppercase !important;
    letter-spacing:1px !important;
    line-height:1.25 !important;
    margin-top:0;
    margin-bottom:12px;
    white-space:normal !important;
    overflow-wrap:break-word;
    word-break:break-word;
}

/* label jangan dipaksa uppercase semua */
label,
.label{
    color:#ffd400 !important;
    font-weight:700 !important;
    line-height:1.35 !important;
    white-space:normal !important;
}

/* judul produk Magento sering kepotong */
.product-item-name,
.product.name,
.page-title-wrapper .page-title{
    display:block !important;
    width:100% !important;
    overflow:visible !important;
    min-height:0 !important;
}

/* link judul produk */
.product-item-name a,
.product.name a{
    color:#ffd400 !important;
    font-weight:900 !important;
    text-transform:uppercase !important;
    line-height:1.3 !important;
    white-space:normal !important;
    display:block !important;
}

/* =========================
   BUTTON FIX
========================= */
/* jangan target .action global karena terlalu banyak elemen kecil Magento */
button,
.button,
.btn,
.action.primary,
.action.tocart,
.action.multicheckout,
.checkout,
.tocart,
input[type="submit"],
input[type="button"],
input[type="reset"]{
    background:#ff1717 !important;
    color:#fff !important;
    border:5px solid #000 !important;
    border-radius:0 !important;
    font-weight:900 !important;
    text-transform:uppercase !important;
    min-height:52px !important;
    padding:12px 18px !important;
    box-shadow:4px 4px 0 #000 !important;
    transition:.15s !important;
    text-shadow:none !important;
    line-height:1.2 !important;
    white-space:normal !important;
    text-align:center !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    max-width:100%;
}

/* isi tombol */
button span,
.button span,
.btn span,
.action.primary span,
.action.tocart span,
.checkout span,
.tocart span{
    color:#fff !important;
    line-height:1.2 !important;
    white-space:normal !important;
}

/* hover */
button:hover,
.button:hover,
.btn:hover,
.action.primary:hover,
.action.tocart:hover,
.checkout:hover,
.tocart:hover,
input[type="submit"]:hover,
input[type="button"]:hover{
    transform:translate(-2px,-2px) !important;
    box-shadow:6px 6px 0 #000 !important;
    background:#ff2a2a !important;
    color:#fff !important;
}

/* action kecil Magento jangan ikut tombol raksasa */
a.action,
.actions-toolbar a,
.product-addto-links a,
.action.towishlist,
.action.tocompare,
.action.view,
.action.edit,
.action.delete,
.action.showcart{
    min-height:auto !important;
    padding:6px 10px !important;
    border-width:2px !important;
    box-shadow:none !important;
    display:inline-block !important;
    line-height:1.3 !important;
    white-space:normal !important;
}

/* =========================
   INPUT / FORM
========================= */
input:not([type="checkbox"]):not([type="radio"]),
select,
textarea{
    background:#fff !important;
    color:#000 !important;
    border:3px solid #ff0000 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    min-height:44px;
    padding:10px 12px !important;
    line-height:1.35 !important;
}

input::placeholder,
textarea::placeholder{
    color:#444 !important;
    opacity:1 !important;
}

label{
    color:#ffd400 !important;
    font-weight:700 !important;
}

input[type="checkbox"],
input[type="radio"]{
    accent-color:#ff1717;
    min-height:auto !important;
    box-shadow:none !important;
}

/* =========================
   TABLE
========================= */
table{
    width:100%;
    border-collapse:collapse !important;
    background:#111 !important;
    table-layout:auto !important;
}

table th,
thead th{
    background:#ff1010 !important;
    color:#fff !important;
    border:3px solid #000 !important;
    font-weight:900 !important;
    text-transform:uppercase !important;
    padding:10px !important;
    line-height:1.3 !important;
    white-space:normal !important;
}

table td{
    background:#1a1a1a !important;
    color:#fff !important;
    border:3px solid #000 !important;
    padding:10px !important;
    line-height:1.4 !important;
    white-space:normal !important;
}

/* =========================
   MESSAGE / NOTICE
========================= */
.promo-bar,
.running-text,
.marquee,
.notice,
.message,
.message.success,
.message.notice,
.message.error,
.message.warning{
    background:#fff !important;
    color:#000 !important;
    font-weight:900 !important;
    border:3px solid #000 !important;
    padding:10px 14px !important;
    line-height:1.4 !important;
    white-space:normal !important;
}

.promo-bar *,
.running-text *,
.marquee *,
.notice *,
.message *,
.message.success *,
.message.notice *,
.message.error *,
.message.warning *{
    color:#000 !important;
}

/* =========================
   CARD MERAH
========================= */
.red-card{
    background:linear-gradient(180deg,#ff1010,#8f0000) !important;
    border:4px solid #000 !important;
    color:#fff !important;
}

/* =========================
   PRODUCT / MAGENTO
========================= */
.product-item,
.product-item-info,
.product-item-details,
.product-info-main,
.product.media,
.price-box,
.product-addto-links,
.product-social-links,
.swatch-attribute,
.block.related,
.block.upsell,
.block.crosssell{
    color:#fff !important;
    border-radius:0 !important;
}

/* harga */
.price,
.special-price,
.old-price,
.price-final_price,
.price-wrapper{
    color:#fff !important;
    font-weight:900 !important;
    line-height:1.3 !important;
}

/* spacing product detail */
.product-info-main .product-info-price,
.product-info-main .box-tocart,
.product-info-main .product.attribute,
.product-info-main .product-add-form{
    margin-bottom:14px !important;
}

/* swatch sering kepotong */
.swatch-attribute{
    margin-bottom:14px !important;
}
.swatch-attribute-label{
    color:#ffd400 !important;
    font-weight:700 !important;
    line-height:1.35 !important;
    display:block !important;
    margin-bottom:8px !important;
}
.swatch-option{
    background:#111 !important;
    color:#fff !important;
    border:2px solid #ff0000 !important;
    min-height:36px !important;
    line-height:1.2 !important;
    padding:6px 10px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    white-space:normal !important;
}

/* =========================
   BREADCRUMB / PAGINATION / TOOLBAR
========================= */
.breadcrumbs,
.toolbar,
.toolbar-products,
.pages,
.items.pages-items{
    background:#111 !important;
}

.breadcrumbs,
.toolbar,
.toolbar-products{
    padding:10px 14px !important;
}

.breadcrumbs a,
.pages a,
.toolbar a{
    color:#ffd400 !important;
    font-weight:800 !important;
    line-height:1.35 !important;
}

/* pagination item */
.pages .item{
    line-height:1.3 !important;
}

/* sort/select toolbar */
.toolbar select,
.toolbar input{
    min-height:40px !important;
}

/* =========================
   SIDEBAR / FILTER
========================= */
.sidebar,
.filter,
.filter-options,
.filter-options-item,
.filter-current,
.block.filter{
    background:#111 !important;
    border:3px solid #000 !important;
    color:#fff !important;
}

.filter-options-title,
.filter-current-title,
.filter-label{
    color:#ffd400 !important;
    font-weight:900 !important;
    line-height:1.35 !important;
    white-space:normal !important;
    display:block !important;
    padding:8px 10px !important;
}

.filter-options-content,
.filter-current-content{
    padding:10px !important;
}

/* =========================
   POPUP / MODAL / DROPDOWN
========================= */
.modal-inner-wrap,
.modal-content,
.dropdown,
.minicart-items-wrapper,
.ui-dialog,
.ui-widget-content{
    background:#111 !important;
    color:#fff !important;
    border:3px solid #000 !important;
    border-radius:0 !important;
}

/* minicart title / text */
.minicart-wrapper .block-minicart,
.minicart-wrapper .subtitle,
.minicart-wrapper .product-item-name,
.minicart-wrapper .price{
    line-height:1.35 !important;
    white-space:normal !important;
}

/* =========================
   IMAGE
========================= */
img{
    max-width:100%;
    height:auto;
}

.product-image-container,
.banner,
.thumbnail,
.image-box{
    border:3px solid #000 !important;
    box-shadow:
        0 0 0 1px #2a2a2a,
        0 5px 15px rgba(0,0,0,.5) !important;
}

/* =========================
   TABS / ACCORDION
========================= */
.tabs,
.tab,
.tab-content,
.accordion,
.accordion-item{
    background:#111 !important;
    color:#fff !important;
    border:3px solid #000 !important;
    border-radius:0 !important;
}

.tab,
.accordion-title{
    line-height:1.35 !important;
    white-space:normal !important;
    padding:10px 12px !important;
}

.tab-content,
.accordion-content{
    padding:12px !important;
}

/* =========================
   KHUSUS ANTI TEKS KEPOTONG
========================= */
.product-item-name,
.product-item-details,
.product-item-inner,
.product-item-actions,
.product-item .price-box,
.block-title,
.page-title,
.toolbar,
.breadcrumbs,
.filter-options-title,
.navigation a,
.action.primary,
.action.tocart,
button,
.btn{
    overflow:visible !important;
    text-overflow:unset !important;
}

/* Magento kadang kasih ellipsis */
.product-item-name,
.product-item-name a,
.page-title,
.block-title strong,
.filter-options-title,
.navigation a,
.action.primary span,
.action.tocart span{
    white-space:normal !important;
    text-overflow:unset !important;
    overflow:visible !important;
    max-width:none !important;
}

/* =========================
   FOOTER SPACE
========================= */
body{
    padding-bottom:90px !important;
}