.hubban-dashboard {

    display: flex;

    width: 100%;

    min-height: 100vh;



    background:

        radial-gradient(

            circle at 55% 15%,

            rgba(255, 248, 230, 0.65) 0%,

            rgba(255, 251, 242, 0.35) 35%,

            transparent 65%

        ),

        #fffaf2;



    color: #1e2b42;

    font-family: Arial, sans-serif;

}

.hubban-sidebar {

    width: 220px;

    min-width: 220px;



    background: rgba(255, 253, 248, 0.92);



    border-right: 1px solid #eee6d9;

    padding: 28px 16px;

    box-sizing: border-box;

}



.hubban-logo {

    margin: 0 12px 35px;

}



.hubban-logo img {

    display: block;

    width: 165px;

    max-width: 100%;

    height: auto;

}

.hubban-menu {

    display: flex;

    flex-direction: column;

    gap: 8px;

}



.hubban-menu a {

    padding: 14px 16px;

    border-radius: 16px;

    color: #29354a;

    text-decoration: none;

    font-weight: 600;

}



.hubban-menu a:hover,

.hubban-menu a.active {

    background: #ffebbd;

    color: #704719;

}



.hubban-premium {

    margin-top: 90px;

    padding: 20px 16px;

    border: 1px solid #eee5d8;

    border-radius: 18px;

    background: #fffdf8;

}



.hubban-premium h4 {

    margin: 0 0 10px;

    color: #71491c;

}



.hubban-premium p {

    font-size: 13px;

    line-height: 1.6;

}



.hubban-premium button {

    background: #ffc957;

    border: 0;

    border-radius: 12px;

    padding: 12px;

    font-weight: bold;

    cursor: pointer;

}



.hubban-content {

    flex: 1;

    min-width: 0;

    padding: 28px 35px;

    overflow: hidden;



    background: transparent;

}



.hubban-header {

    display: flex;

    justify-content: space-between;

    align-items: center;

    gap: 20px;

    margin-bottom: 28px;

}



.hubban-greeting h2 {

    margin: 0 0 8px;

    font-size: 25px;

}



.hubban-greeting p {

    margin: 0;

    color: #697080;

}



.hubban-search {

    width: 340px;

    padding: 15px 20px;

    border: 1px solid #e5e1db;

    border-radius: 30px;

    background: #fff;

}



.hubban-section {

    margin-bottom: 27px;

}



.hubban-section-title {

    display: flex;

    justify-content: space-between;

    align-items: center;

    margin-bottom: 13px;

}



.hubban-section-title h3 {

    margin: 0;

    font-size: 18px;

}



.hubban-section-title a {

    color: #4d5664;

    font-size: 13px;

}



.hubban-grid {

    display: grid;

    grid-template-columns: repeat(4, minmax(180px, 1fr));

    gap: 14px;

}



.hubban-card {

    min-height: 150px;

    border-radius: 18px;

    padding: 18px;

    color: #fff;

    display: flex;

    flex-direction: column;

    justify-content: flex-end;

    position: relative;

    overflow: hidden;

    box-sizing: border-box;

}



.hubban-card h4 {

    margin: 0 0 8px;

    font-size: 17px;

}



.hubban-card p {

    margin: 0;

    font-size: 12px;

}



.hubban-card .hubban-play {

    position: absolute;

    top: 15px;

    left: 15px;

    background: #fff;

    color: #555;

    width: 35px;

    height: 35px;

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

}



.hubban-ocean {

    background: linear-gradient(135deg, #3c9fc2, #174e75);

}



.hubban-green {

    background: linear-gradient(135deg, #9cb957, #42652b);

}



.hubban-sunset {

    background: linear-gradient(135deg, #eebc83, #b46b48);

}



.hubban-purple {

    background: linear-gradient(135deg, #42365e, #191d43);

}



.hubban-featured {

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 14px;

}



.hubban-featured .hubban-card {

    min-height: 150px;

}



.hubban-category-list {

    display: flex;

    gap: 10px;

    flex-wrap: wrap;

}



.hubban-category {

    padding: 12px 17px;

    border: 1px solid #eee5da;

    border-radius: 20px;

    background: white;

    font-size: 13px;

    font-weight: 600;

}



.hubban-small-grid {

    display: grid;

    grid-template-columns: repeat(6, 1fr);

    gap: 12px;

}



.hubban-small-card {

    min-height: 105px;

    border-radius: 15px;

    padding: 13px;

    color: white;

    display: flex;

    flex-direction: column;

    justify-content: flex-end;

}



.hubban-bottom-grid {

    display: grid;

    grid-template-columns: 1.3fr 1fr;

    gap: 18px;

}



.hubban-ebook-list {

    display: grid;

    grid-template-columns: repeat(5, 1fr);

    gap: 10px;

}



.hubban-ebook {

    min-height: 145px;

    border-radius: 13px;

    padding: 12px;

    background: #b6d4a2;

    color: #263b2d;

    font-weight: bold;

}



.hubban-ebook:nth-child(2) {

    background: #9bc7c0;

}



.hubban-ebook:nth-child(3) {

    background: #9272bd;

    color: white;

}



.hubban-ebook:nth-child(4) {

    background: #f3c982;

}



.hubban-ebook:nth-child(5) {

    background: #c5d7df;

}



.hubban-coming {

    border-radius: 20px;

    padding: 25px;

    background: linear-gradient(135deg, #e2f0f1, #a8c6d5);

}



.hubban-coming h3 {

    margin: 0 0 15px;

}



.hubban-coming button {

    background: #ffcb60;

    border: 0;

    border-radius: 12px;

    padding: 12px 18px;

    font-weight: bold;

}



@media (max-width: 1000px) {

    .hubban-sidebar {

        width: 160px;

    }



    .hubban-content {

        padding: 22px;

    }



    .hubban-grid {

        grid-template-columns: repeat(2, 1fr);

    }



    .hubban-small-grid {

        grid-template-columns: repeat(3, 1fr);

    }



    .hubban-bottom-grid {

        grid-template-columns: 1fr;

    }

}



@media (max-width: 700px) {

    .hubban-dashboard {

        display: block;

        margin: 0;

    }



    .hubban-sidebar {

        width: 100%;

        padding: 18px;

    }



    .hubban-menu {

        flex-direction: row;

        flex-wrap: wrap;

    }



    .hubban-premium {

        display: none;

    }



    .hubban-header {

        display: block;

    }



    .hubban-search {

        width: 100%;

        margin-top: 20px;

        box-sizing: border-box;

    }



    .hubban-grid,

    .hubban-featured {

        grid-template-columns: 1fr;

    }



    .hubban-small-grid {

        grid-template-columns: repeat(2, 1fr);

    }



    .hubban-ebook-list {

        grid-template-columns: repeat(2, 1fr);

    }

}



/* =========================================================

   HUBBAN FULL WIDTH FIX

   ========================================================= */



body .site,

body .site-content,

body .content-area,

body .site-main,

body main,

body article,

body .entry-content {

    max-width: none !important;

}



/* Hilangkan margin bawaan content WordPress */

body .entry-content {

    margin: 0 !important;

    padding: 0 !important;

}



/* Dashboard keluar dari container theme */

.hubban-dashboard {

    width: 100vw !important;

    max-width: 100vw !important;



    position: relative;

    left: 50%;

    margin-left: -50vw !important;



    margin-top: 0 !important;

    margin-right: 0 !important;

    margin-bottom: 0 !important;



    min-height: 100vh;

}



/* Hilangkan judul halaman "Dashboard" */

body:has(.hubban-dashboard) .entry-title,

body:has(.hubban-dashboard) .page-title {

    display: none !important;

}



/* Hilangkan padding container theme */

body:has(.hubban-dashboard) .site-content,

body:has(.hubban-dashboard) .content-area,

body:has(.hubban-dashboard) .site-main,

body:has(.hubban-dashboard) article,

body:has(.hubban-dashboard) .entry-content {

    width: 100% !important;

    max-width: none !important;

    margin: 0 !important;

    padding: 0 !important;

}



/* Jangan sampai muncul horizontal scrollbar */

html,

body {

    overflow-x: hidden;

}



/* ==========================================================

   HUBBAN APP MODE

   Hilangkan elemen bawaan theme pada halaman dashboard

   ========================================================== */



body:has(.hubban-dashboard) header.wp-block-template-part,

body:has(.hubban-dashboard) .site-header,

body:has(.hubban-dashboard) #masthead {

    display: none !important;

}



/* Hilangkan judul Dashboard bawaan WordPress */

body:has(.hubban-dashboard) .entry-header,

body:has(.hubban-dashboard) .entry-title,

body:has(.hubban-dashboard) .page-title {

    display: none !important;

}



/* Hilangkan spacing bawaan page */

body:has(.hubban-dashboard) .wp-site-blocks,

body:has(.hubban-dashboard) .site,

body:has(.hubban-dashboard) .site-content,

body:has(.hubban-dashboard) .content-area,

body:has(.hubban-dashboard) .site-main,

body:has(.hubban-dashboard) main,

body:has(.hubban-dashboard) article,

body:has(.hubban-dashboard) .entry-content {

    margin: 0 !important;

    padding: 0 !important;

    max-width: none !important;

    width: 100% !important;

}



/* Hilangkan block gap theme */

body:has(.hubban-dashboard) .wp-site-blocks {

    padding-top: 0 !important;

    padding-bottom: 0 !important;

}



body:has(.hubban-dashboard) main {

    margin-block-start: 0 !important;

}



body:has(.hubban-dashboard) article {

    margin-block-start: 0 !important;

}



/* Dashboard menjadi full browser */

body:has(.hubban-dashboard) .hubban-dashboard {

    position: relative;

    left: 50%;

    width: 100vw !important;

    max-width: 100vw !important;

    margin-left: -50vw !important;

    margin-top: 0 !important;

    min-height: 100vh;

}

body:has(.hubban-dashboard) {

    background: #fffaf2 !important;

}



/* =========================================================

   CHILD PROFILE SELECTOR

   ========================================================= */



.hubban-profile-page {

    width: 100%;

    min-height: 100vh;



    display: flex;

    justify-content: center;

    align-items: center;



    background: #fffaf2;



    padding: 40px 20px;

    box-sizing: border-box;

}



.hubban-profile-box {

    width: 100%;

    max-width: 900px;

    text-align: center;

}



.hubban-profile-logo {

    margin-bottom: 45px;

}



.hubban-profile-logo img {

    width: 190px;

    height: auto;

}



.hubban-profile-box h1 {

    color: #1e2b42;

    font-size: 34px;

    margin: 0 0 10px;

}



.hubban-profile-subtitle {

    color: #727885;

    margin-bottom: 40px;

}



.hubban-profile-list {

    display: flex;

    justify-content: center;

    align-items: flex-start;

    flex-wrap: wrap;

    gap: 35px;

}



.hubban-profile-item {

    width: 140px;



    text-decoration: none !important;



    color: #1e2b42 !important;



    display: flex;

    flex-direction: column;

    align-items: center;



    gap: 12px;

}



.hubban-profile-avatar {

    width: 125px;

    height: 125px;



    border-radius: 30px;



    display: flex;

    justify-content: center;

    align-items: center;



    background: #ffe8ad;



    font-size: 55px;



    overflow: hidden;



    border: 4px solid transparent;



    transition: all .2s ease;

}



.hubban-profile-avatar img {

    width: 100%;

    height: 100%;

    object-fit: cover;

}



.hubban-profile-item:hover .hubban-profile-avatar {

    transform: translateY(-5px);

    border-color: #ffc957;



    box-shadow:

        0 12px 30px

        rgba(70, 55, 30, .12);

}



.hubban-profile-item strong {

    font-size: 17px;

}



.hubban-add-profile {

    background: #ffffff;

    border: 2px dashed #d9d1c4;



    font-size: 45px;

    color: #d09a2d;

}



/* =========================================================

   HUBBAN PARENT DASHBOARD

   ========================================================= */



.hubban-parent-page {

    min-height: 100vh;

    background: #fffaf2;

    padding: 45px;

    box-sizing: border-box;

    color: #1e2b42;

}



.hubban-parent-container {

    max-width: 1200px;

    margin: 0 auto;

}



.hubban-parent-header {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;

    margin-bottom: 30px;

}



.hubban-parent-header h1 {

    margin: 0 0 7px;

    font-size: 32px;

    color: #1e2b42;

}



.hubban-parent-header p {

    margin: 0;

    color: #737a87;

}



.hubban-parent-select-profile {

    padding: 13px 22px;

    border-radius: 14px;

    background: #ffc957;

    color: #533b16 !important;

    font-weight: 700;

    text-decoration: none !important;

}



.hubban-parent-form-card {

    background: #fff;

    padding: 28px;

    border: 1px solid #eee6d9;

    border-radius: 22px;

    margin-bottom: 40px;



    box-shadow:

        0 8px 30px

        rgba(55, 45, 30, .04);

}



.hubban-parent-form-card h2 {

    margin: 0 0 22px;

    color: #1e2b42;

}



.hubban-parent-form-grid {

    display: grid;

    grid-template-columns:

        minmax(200px, 2fr)

        minmax(180px, 1fr)

        minmax(180px, 1fr);

    gap: 18px;

    margin-bottom: 20px;

}



.hubban-field label {

    display: block;

    font-size: 13px;

    font-weight: 700;

    margin-bottom: 8px;

}



.hubban-field input,

.hubban-field select {

    width: 100%;

    height: 48px;

    padding: 0 14px;

    box-sizing: border-box;



    border: 1px solid #ddd8cf;

    border-radius: 12px;



    background: #fffdf9;

    color: #1e2b42;



    outline: none;

}



.hubban-field input:focus,

.hubban-field select:focus {

    border-color: #eeb84d;

}



.hubban-btn-primary,

.hubban-btn-secondary,

.hubban-btn-edit,

.hubban-btn-delete {

    border: 0;

    border-radius: 11px;

    padding: 11px 17px;



    font-size: 13px;

    font-weight: 700;



    cursor: pointer;

    text-decoration: none !important;

}



.hubban-btn-primary {

    background: #ffc957;

    color: #513a16;

}



.hubban-btn-secondary {

    background: #f2eee8;

    color: #555 !important;

}



.hubban-form-actions {

    display: flex;

    align-items: center;

    gap: 10px;

}



.hubban-parent-section-title {

    margin-bottom: 18px;

}



.hubban-parent-section-title h2 {

    margin: 0;

    color: #1e2b42;

}



.hubban-parent-section-title p {

    margin: 5px 0 0;

    color: #818181;

    font-size: 13px;

}



.hubban-parent-child-grid {

    display: grid;

    grid-template-columns:

        repeat(3, minmax(250px, 1fr));

    gap: 18px;

}



.hubban-parent-child-card {

    background: #fff;

    border: 1px solid #eee6d9;

    border-radius: 20px;



    padding: 22px;



    display: flex;

    flex-direction: column;



    box-shadow:

        0 8px 25px

        rgba(55, 45, 30, .04);

}



.hubban-parent-child-avatar {

    width: 75px;

    height: 75px;



    display: flex;

    align-items: center;

    justify-content: center;



    border-radius: 22px;

    background: #dcebd0;



    font-size: 38px;



    margin-bottom: 15px;



    overflow: hidden;

}



.hubban-parent-child-avatar.female {

    background: #f4dfeb;

}



.hubban-parent-child-avatar img {

    width: 100%;

    height: 100%;

    object-fit: cover;

}



.hubban-parent-child-info {

    flex: 1;

}



.hubban-parent-child-info h3 {

    margin: 0 0 8px;

    font-size: 20px;

    color: #1e2b42;

}



.hubban-parent-child-info p {

    margin: 0 0 9px;

    color: #7a7f89;

    font-size: 13px;

}



.hubban-child-gender {

    display: inline-block;



    background: #f5f1e9;



    border-radius: 20px;



    padding: 6px 10px;



    font-size: 11px;

    font-weight: 700;

}



.hubban-parent-child-actions {

    display: flex;

    gap: 8px;

    margin-top: 20px;

    padding-top: 15px;



    border-top: 1px solid #f0ece5;

}



.hubban-parent-child-actions form {

    margin: 0;

}



.hubban-btn-edit {

    background: #e8f0fb;

    color: #315f94 !important;

}



.hubban-btn-delete {

    background: #fff0ed;

    color: #b64c3f;

}



.hubban-parent-empty {

    padding: 55px 20px;



    text-align: center;



    background: #fff;

    border: 1px dashed #ddd4c6;

    border-radius: 20px;

}



.hubban-parent-empty > div {

    font-size: 50px;

}



.hubban-parent-empty h3 {

    margin: 15px 0 5px;

}



.hubban-parent-empty p {

    margin: 0;

    color: #777;

}



.hubban-message {

    max-width: 1200px;



    margin:

        20px auto

        -20px auto;



    padding: 14px 18px;



    border-radius: 12px;



    font-weight: 600;

}



.hubban-message.success {

    background: #e9f6e5;

    color: #3f7134;

}



.hubban-message.error {

    background: #fff0ed;

    color: #a7473c;

}





/* RESPONSIVE */



@media (max-width: 900px) {



    .hubban-parent-child-grid {

        grid-template-columns:

            repeat(2, 1fr);

    }



    .hubban-parent-form-grid {

        grid-template-columns: 1fr;

    }

}



@media (max-width: 600px) {



    .hubban-parent-page {

        padding: 25px 15px;

    }



    .hubban-parent-header {

        align-items: flex-start;

        flex-direction: column;

    }



    .hubban-parent-child-grid {

        grid-template-columns: 1fr;

    }

}



/* =========================================================

   PARENT DASHBOARD - FULL WIDTH / THEME RESET

   ========================================================= */



body:has(.hubban-parent-page) {

    background: #fffaf2 !important;

}



/* Hilangkan header theme */

body:has(.hubban-parent-page) header.wp-block-template-part,

body:has(.hubban-parent-page) .site-header,

body:has(.hubban-parent-page) #masthead {

    display: none !important;

}



/* Hilangkan judul halaman WordPress */

body:has(.hubban-parent-page) .entry-header,

body:has(.hubban-parent-page) .entry-title,

body:has(.hubban-parent-page) .page-title {

    display: none !important;

}



/* Hilangkan container / spacing theme */

body:has(.hubban-parent-page) .wp-site-blocks,

body:has(.hubban-parent-page) .site,

body:has(.hubban-parent-page) .site-content,

body:has(.hubban-parent-page) .content-area,

body:has(.hubban-parent-page) .site-main,

body:has(.hubban-parent-page) main,

body:has(.hubban-parent-page) article,

body:has(.hubban-parent-page) .entry-content {

    width: 100% !important;

    max-width: none !important;



    margin: 0 !important;

    padding: 0 !important;

}



body:has(.hubban-parent-page) main,

body:has(.hubban-parent-page) article {

    margin-block-start: 0 !important;

}



/* Parent Dashboard full browser */

body:has(.hubban-parent-page) .hubban-parent-page {

    position: relative;



    left: 50%;



    width: 100vw !important;

    max-width: 100vw !important;



    margin-left: -50vw !important;



    min-height: 100vh;



    padding: 45px 55px;



    box-sizing: border-box;



    background: #fffaf2;

}





/* =========================================================

   PARENT CONTENT

   ========================================================= */



.hubban-parent-container {

    width: 100%;

    max-width: 1250px;

    margin: 0 auto;

}





/* Header */



.hubban-parent-header {

    display: flex;

    justify-content: space-between;

    align-items: center;



    margin-bottom: 30px;

}



.hubban-parent-header h1 {

    margin: 0 0 5px;



    font-size: 32px;

    font-weight: 700;



    color: #1e2b42;

}



.hubban-parent-header p {

    margin: 0;

    color: #747b87;

}





/* =========================================================

   FORM

   ========================================================= */



.hubban-parent-form-card {

    width: 100%;



    background: #ffffff;



    border: 1px solid #eee6d9;

    border-radius: 22px;



    padding: 28px 30px;



    margin-bottom: 40px;



    box-sizing: border-box;



    box-shadow:

        0 8px 30px

        rgba(55, 45, 30, 0.04);

}



.hubban-parent-form-card h2 {

    margin: 0 0 25px;



    color: #1e2b42;

    font-size: 24px;

}





/* 3 field sejajar */



.hubban-parent-form-grid {

    width: 100%;



    display: grid;



    grid-template-columns:

        minmax(0, 2fr)

        minmax(0, 1fr)

        minmax(0, 1fr);



    gap: 20px;



    margin-bottom: 22px;

}



.hubban-field {

    min-width: 0;

}



.hubban-field label {

    display: block;



    margin-bottom: 8px;



    font-size: 13px;

    font-weight: 700;



    color: #1e2b42;

}



.hubban-field input,

.hubban-field select {

    display: block;



    width: 100%;

    max-width: 100%;



    height: 48px;



    padding: 0 14px;



    box-sizing: border-box;



    border: 1px solid #ddd8cf;

    border-radius: 12px;



    background: #fffdf9;



    color: #1e2b42;

}





/* =========================================================

   RESPONSIVE

   ========================================================= */



@media (max-width: 900px) {



    body:has(.hubban-parent-page) .hubban-parent-page {

        padding: 30px 20px;

    }



    .hubban-parent-form-grid {

        grid-template-columns: 1fr;

    }

}



@media (max-width: 600px) {



    .hubban-parent-header {

        align-items: flex-start;

        flex-direction: column;

        gap: 20px;

    }

}



/* =========================================================

   ACTIVE CHILD PROFILE

   ========================================================= */



.hubban-header-right {

    display: flex;

    align-items: center;

    gap: 18px;

}



.hubban-search-wrapper {

    position: relative;

    width: 350px;

}



.hubban-search-wrapper .hubban-search {

    width: 100%;

    height: 48px;



    padding:

        0 20px

        0 45px;



    box-sizing: border-box;



    border:

        1px solid

        #e5dfd5;



    border-radius: 28px;



    background: rgba(

        255,

        255,

        255,

        .75

    );



    outline: none;

}



.hubban-search-icon {

    position: absolute;



    left: 17px;

    top: 50%;



    transform:

        translateY(-50%);



    z-index: 2;



    font-size: 14px;

}



.hubban-notification {

    width: 40px;

    height: 40px;



    display: flex;

    align-items: center;

    justify-content: center;



    font-size: 19px;



    cursor: pointer;

}



.hubban-active-profile {

    display: flex;

    align-items: center;



    gap: 10px;



    text-decoration: none !important;



    color: #1e2b42 !important;

}



.hubban-active-avatar {

    width: 46px;

    height: 46px;



    display: flex;

    align-items: center;

    justify-content: center;



    border-radius: 50%;



    background: #dcebd0;



    font-size: 25px;



    overflow: hidden;

}



.hubban-active-avatar img {

    width: 100%;

    height: 100%;



    object-fit: cover;

}



.hubban-active-profile strong {

    font-size: 14px;

}



.hubban-profile-arrow {

    font-size: 13px;

}





/* =========================================================

   NO PROFILE SELECTED

   ========================================================= */



.hubban-no-profile {

    width: 100vw;

    min-height: 100vh;



    display: flex;

    align-items: center;

    justify-content: center;



    background: #fffaf2;

}



.hubban-no-profile-box {

    text-align: center;



    background: #fff;



    padding: 45px 55px;



    border:

        1px solid

        #eee6d9;



    border-radius: 25px;



    box-shadow:

        0 15px 40px

        rgba(50, 40, 20, .06);

}



.hubban-no-profile-box h2 {

    margin:

        0 0 10px;



    color: #1e2b42;

}



.hubban-no-profile-box p {

    color: #737a87;



    margin:

        0 0 25px;

}



.hubban-no-profile-button {

    display: inline-block;



    padding:

        13px 22px;



    border-radius: 12px;



    background: #ffc957;



    color: #543d17 !important;



    font-weight: 700;



    text-decoration: none !important;

}





/* RESPONSIVE */



@media (max-width: 900px) {



    .hubban-header-right {

        margin-top: 20px;

        width: 100%;

    }



    .hubban-search-wrapper {

        flex: 1;

        width: auto;

    }

}



@media (max-width: 600px) {



    .hubban-active-profile strong,

    .hubban-profile-arrow {

        display: none;

    }



    .hubban-notification {

        display: none;

    }

}



/* =========================================================

   PILIH PROFIL - FULL SCREEN

   ========================================================= */



body:has(.hubban-profile-page) {

    background: #fffaf2 !important;

}



/* Hilangkan header/navigation theme */

body:has(.hubban-profile-page) header.wp-block-template-part,

body:has(.hubban-profile-page) .site-header,

body:has(.hubban-profile-page) #masthead {

    display: none !important;

}



/* Hilangkan judul "Pilih Profil" bawaan WordPress */

body:has(.hubban-profile-page) .entry-header,

body:has(.hubban-profile-page) .entry-title,

body:has(.hubban-profile-page) .page-title {

    display: none !important;

}



/* Reset container theme */

body:has(.hubban-profile-page) .wp-site-blocks,

body:has(.hubban-profile-page) .site,

body:has(.hubban-profile-page) .site-content,

body:has(.hubban-profile-page) .content-area,

body:has(.hubban-profile-page) .site-main,

body:has(.hubban-profile-page) main,

body:has(.hubban-profile-page) article,

body:has(.hubban-profile-page) .entry-content {

    width: 100% !important;

    max-width: none !important;



    margin: 0 !important;

    padding: 0 !important;

}



body:has(.hubban-profile-page) main,

body:has(.hubban-profile-page) article {

    margin-block-start: 0 !important;

}



/* Full browser */

body:has(.hubban-profile-page) .hubban-profile-page {

    position: relative;



    left: 50%;



    width: 100vw !important;

    max-width: 100vw !important;



    margin-left: -50vw !important;



    min-height: 100vh;



    padding: 40px 20px;



    box-sizing: border-box;



    background:

        radial-gradient(

            circle at 50% 25%,

            rgba(255, 239, 199, .45),

            transparent 45%

        ),

        #fffaf2;

}





/* =========================================================

   PROFILE SELECTOR

   ========================================================= */



.hubban-profile-box {

    width: 100%;

    max-width: 850px;



    margin: auto;



    text-align: center;

}



.hubban-profile-logo {

    margin-bottom: 35px;

}



.hubban-profile-logo img {

    width: 185px;

    max-width: 80%;

    height: auto;

}



.hubban-profile-box h1 {

    margin: 0 0 10px;



    font-size: 36px;

    font-weight: 700;



    color: #1e2b42;

}



.hubban-profile-subtitle {

    margin: 0 0 42px;



    color: #737a87;



    font-size: 16px;

}





/* LIST PROFILE */



.hubban-profile-list {

    display: flex;



    justify-content: center;

    align-items: flex-start;



    flex-wrap: wrap;



    gap: 35px;

}



.hubban-profile-item {

    width: 135px;



    display: flex;

    flex-direction: column;

    align-items: center;



    gap: 12px;



    text-decoration: none !important;



    color: #1e2b42 !important;

}





/* AVATAR */



.hubban-profile-avatar {

    width: 125px;

    height: 125px;



    display: flex;



    align-items: center;

    justify-content: center;



    border-radius: 30px;



    background: #ffe6a6;



    font-size: 54px;



    overflow: hidden;



    border: 4px solid transparent;



    box-sizing: border-box;



    transition:

        transform .2s ease,

        border-color .2s ease,

        box-shadow .2s ease;

}



.hubban-profile-avatar img {

    width: 100%;

    height: 100%;

    object-fit: cover;

}



.hubban-profile-item:hover .hubban-profile-avatar {

    transform: translateY(-6px);



    border-color: #ffc957;



    box-shadow:

        0 15px 35px

        rgba(92, 67, 27, .14);

}



.hubban-profile-item strong {

    font-size: 16px;

}





/* TAMBAH PROFIL */



.hubban-add-profile {

    background: rgba(255,255,255,.65);



    border:

        2px dashed

        #d9cdbb;



    color: #d59a24;



    font-size: 42px;

}





/* MOBILE */



@media (max-width: 600px) {



    body:has(.hubban-profile-page) .hubban-profile-page {

        padding: 30px 15px;

    }



    .hubban-profile-box h1 {

        font-size: 28px;

    }



    .hubban-profile-list {

        gap: 22px;

    }



    .hubban-profile-item {

        width: 110px;

    }



    .hubban-profile-avatar {

        width: 105px;

        height: 105px;

    }

}



/* Hilangkan title bawaan WordPress pada Dashboard Anak */

body:has(.hubban-dashboard) .wp-block-post-title,

body:has(.hubban-dashboard) h1.entry-title,

body:has(.hubban-dashboard) .entry-header,

body:has(.hubban-dashboard) .page-title {

    display: none !important;

}



/* Hilangkan spacing yang ditinggalkan title */

body:has(.hubban-dashboard) main,

body:has(.hubban-dashboard) article,

body:has(.hubban-dashboard) .entry-content {

    margin-top: 0 !important;

    padding-top: 0 !important;

}



body:has(.hubban-dashboard) .hubban-dashboard {

    margin-top: 0 !important;

}



/* Inner horizontal spacing */

.hubban-content > .hubban-header,

.hubban-content > .hubban-section,

.hubban-content > .hubban-bottom-grid {

    padding-left: 15px !important;

    padding-right: 15px !important;

    box-sizing: border-box;

}/* HUBBAN DASHBOARD ANAK — visual refresh, scoped to .hubban-dashboard only.
   Preserve database, membership, player, catalogue, and parent pages. */
.hubban-dashboard{--hd-ink:#1c2a40;--hd-muted:#657082;--hd-gold:#ffcc72;display:flex!important;align-items:stretch!important;background:#fffaf4!important;color:var(--hd-ink)!important;font-family:inherit!important;min-height:100vh!important}
.hubban-dashboard *{box-sizing:border-box}
.hubban-dashboard .hubban-sidebar{width:226px!important;min-width:226px!important;flex:0 0 226px!important;padding:28px 25px 24px!important;background:#fffdfa!important;border-right:1px solid #efe7dc!important;display:flex!important;flex-direction:column!important}
.hubban-dashboard .hubban-logo{margin:5px 9px 30px!important}
.hubban-dashboard .hubban-logo img{width:160px!important;max-width:100%!important}
.hubban-dashboard .hubban-menu{gap:6px!important}
.hubban-dashboard .hubban-sidebar .hubban-menu>a{min-height:44px!important;height:44px!important;padding:0 15px!important;border-radius:14px!important;display:flex!important;align-items:center!important;gap:9px!important;font-size:13px!important;font-weight:700!important;color:#364054!important;text-decoration:none!important;white-space:nowrap!important}
.hubban-dashboard .hubban-sidebar .hubban-menu>a.active,.hubban-dashboard .hubban-sidebar .hubban-menu>a:hover{background:#ffedc7!important;color:#744c1e!important}
.hubban-dashboard .hubban-sidebar .hubban-menu>a:last-child{margin-top:24px!important;border-top:1px solid #f1e9df!important;border-radius:0!important;padding-top:15px!important;height:60px!important}
.hubban-dashboard .hubban-premium{margin-top:auto!important;padding:17px 15px!important;background:#fffdfa!important;border:1px solid #efe5d8!important;border-radius:17px!important;box-shadow:none!important}
.hubban-dashboard .hubban-premium h4{font-size:15px!important;margin:0 0 10px!important}
.hubban-dashboard .hubban-premium p{font-size:12px!important;line-height:1.6!important;margin:0 0 14px!important}
.hubban-dashboard .hubban-content{flex:1!important;min-width:0!important;width:auto!important;overflow:hidden!important;padding:28px 34px 36px!important;background:transparent!important}
.hubban-dashboard .hubban-content>.hubban-header,.hubban-dashboard .hubban-content>.hubban-section,.hubban-dashboard .hubban-content>.hubban-bottom-grid{padding-left:0!important;padding-right:0!important}
.hubban-dashboard .hubban-header{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:20px!important;margin:0 0 24px!important}
.hubban-dashboard .hubban-greeting h2{font-size:24px!important;line-height:1.22!important;font-weight:800!important;letter-spacing:-.5px!important;color:var(--hd-ink)!important;margin:0 0 6px!important}
.hubban-dashboard .hubban-greeting p{font-size:14px!important;color:var(--hd-muted)!important;margin:0!important}
.hubban-dashboard .hubban-header-right{display:flex!important;align-items:center!important;gap:18px!important;flex-wrap:nowrap!important}
.hubban-dashboard .hubban-search-wrapper{width:330px!important;max-width:35vw!important;flex:0 1 330px!important}
.hubban-dashboard .hubban-search-wrapper .hubban-search{height:44px!important;border:1px solid #e9e5df!important;border-radius:28px!important;background:#fff!important;font-size:12px!important}
.hubban-dashboard .hubban-notification{font-size:19px!important;color:#3c4450!important}
.hubban-dashboard .hubban-section{margin:0 0 23px!important}
.hubban-dashboard .hubban-section-title{margin-bottom:11px!important;gap:12px!important}
.hubban-dashboard .hubban-section-title h3{font-size:16px!important;line-height:1.3!important;font-weight:800!important;color:var(--hd-ink)!important}
.hubban-dashboard .hubban-section-title a{font-size:12px!important;color:#435061!important;text-decoration:none!important}
/* Continue Watching: reference-style horizontal, image-first cards */
.hubban-dashboard .hubban-continue-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:14px!important}
.hubban-dashboard .hubban-continue-grid>a.hubban-continue-card{display:block!important;position:relative!important;min-width:0!important;min-height:0!important;aspect-ratio:1.62!important;overflow:hidden!important;border:0!important;border-radius:16px!important;background:#183c51!important;box-shadow:0 3px 12px #25364a0d!important;color:#fff!important;transform:none!important}
.hubban-dashboard .hubban-continue-card .hubban-continue-thumb{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;min-height:0!important;background-size:cover!important;background-position:center!important}
.hubban-dashboard .hubban-continue-card .hubban-continue-thumb:after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(8,25,29,.92),rgba(8,25,29,.05) 67%);pointer-events:none}
.hubban-dashboard .hubban-continue-card .hubban-dashboard-play,.hubban-dashboard .hubban-continue-card .hubban-continue-play{position:absolute!important;left:50%!important;top:47%!important;transform:translate(-50%,-50%)!important;width:43px!important;height:43px!important;border-radius:50%!important;display:grid!important;place-items:center!important;background:#fff!important;color:#24334a!important;z-index:2!important;font-size:18px!important;box-shadow:0 3px 12px #0002!important}
.hubban-dashboard .hubban-continue-card .hubban-continue-body{position:absolute!important;bottom:0!important;left:0!important;right:0!important;z-index:2!important;padding:30px 12px 12px!important;background:none!important;color:#fff!important;pointer-events:none!important}
.hubban-dashboard .hubban-continue-card .hubban-continue-body small,.hubban-dashboard .hubban-continue-card .hubban-continue-body p{display:none!important}
.hubban-dashboard .hubban-continue-card .hubban-continue-body h4{font-size:14px!important;font-weight:800!important;color:#fff!important;line-height:1.2!important;margin:0 0 8px!important;text-shadow:0 1px 3px #0007!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.hubban-dashboard .hubban-continue-card .hubban-progress-track{height:5px!important;background:#ffffff6b!important;border-radius:20px!important;overflow:hidden!important;margin:0 0 5px!important}
.hubban-dashboard .hubban-continue-card .hubban-progress-track span{display:block!important;height:100%!important;background:#b7db85!important;border-radius:20px!important}
.hubban-dashboard .hubban-continue-card .hubban-progress-meta{display:flex!important;justify-content:flex-end!important;color:#fff!important;font-size:10px!important;gap:5px!important}
.hubban-dashboard .hubban-continue-card .hubban-progress-meta span:last-child{display:none!important}
.hubban-dashboard .hubban-continue-card .hubban-progress-meta span:first-child:after{content:" selesai"}
/* Featured: 3 wide image cards */
.hubban-dashboard .hubban-featured{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:14px!important}
.hubban-dashboard .hubban-featured>a.hubban-series-card{min-width:0!important;min-height:0!important;aspect-ratio:2.45!important;border-radius:16px!important;padding:17px 20px!important;background-position:center!important;background-size:cover!important;justify-content:flex-end!important;text-decoration:none!important;box-shadow:0 3px 10px #172b4010!important}
.hubban-dashboard .hubban-series-card .hubban-series-caption{position:relative!important;z-index:2!important}
.hubban-dashboard .hubban-series-card .hubban-series-caption small{font-size:12px!important;color:#fff!important}
.hubban-dashboard .hubban-series-card .hubban-series-caption h4{font-size:27px!important;line-height:1.12!important;font-weight:800!important;color:#fff!important;margin:4px 0 9px!important}
.hubban-dashboard .hubban-series-card .hubban-series-caption p{margin:0!important}
.hubban-dashboard .hubban-series-card .hubban-series-caption p span{display:inline-block!important;border-radius:30px!important;padding:5px 11px!important;background:#4d924c!important;color:#fff!important;font-size:11px!important;font-weight:800!important}
.hubban-dashboard .hubban-series-card:nth-child(2) .hubban-series-caption p span{background:#447bb5!important}
.hubban-dashboard .hubban-series-card:nth-child(3) .hubban-series-caption p span{background:#7c51ac!important}
/* Categories: single-line scroll on desktop */
.hubban-dashboard .hubban-category-list{display:flex!important;flex-wrap:nowrap!important;overflow-x:auto!important;gap:10px!important;padding:1px 0 8px!important;scrollbar-width:thin!important}
.hubban-dashboard .hubban-category{flex:0 0 auto!important;white-space:nowrap!important;padding:11px 14px!important;background:#fff!important;border:1px solid #eee7df!important;border-radius:15px!important;box-shadow:0 3px 10px #172b4009!important;font-size:12px!important;color:#2b3549!important}
/* Latest videos: 6 thumbnails across */
.hubban-dashboard .hubban-small-grid{display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:12px!important}
.hubban-dashboard .hubban-small-grid>a.hubban-video-card{min-width:0!important;min-height:0!important;aspect-ratio:1.48!important;border-radius:14px!important;padding:0!important;background-size:cover!important;background-position:center!important;box-shadow:none!important}
.hubban-dashboard .hubban-small-card-caption{padding:30px 11px 11px!important}
.hubban-dashboard .hubban-small-card-caption h4{font-size:13px!important;line-height:1.2!important;margin:0 0 4px!important}
.hubban-dashboard .hubban-small-card-caption p{font-size:10px!important}
/* Reading sections: keep data intact, compact like the reference */
.hubban-dashboard .hubban-reading-section .hubban-ebook-covers{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:12px!important}
.hubban-dashboard .hubban-reading-section a.hubban-ebook-cover{aspect-ratio:1.7!important;border-radius:14px!important}
.hubban-dashboard .hubban-bottom-grid{display:grid!important;grid-template-columns:1.15fr 1fr!important;gap:16px!important;align-items:stretch!important;margin-top:6px!important}
.hubban-dashboard .hubban-bottom-grid>.hubban-section{margin:0!important;padding:14px 13px!important;background:#fffdf9!important;border:1px solid #f0e8dc!important;border-radius:18px!important}
.hubban-dashboard .hubban-bottom-grid .hubban-ebook-list{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:9px!important}
.hubban-dashboard .hubban-bottom-grid a.hubban-ebook-cover{display:flex!important;flex-direction:column!important;justify-content:flex-end!important;min-width:0!important;min-height:0!important;aspect-ratio:.72!important;height:auto!important;padding:10px!important;border-radius:12px!important;background-size:cover!important;background-position:center!important;overflow:hidden!important}
.hubban-dashboard .hubban-bottom-grid a.hubban-ebook-cover strong{font-size:13px!important;line-height:1.3!important}
.hubban-dashboard .hubban-bottom-grid a.hubban-ebook-cover small{font-size:10px!important}
.hubban-dashboard .hubban-coming-card{min-height:235px!important;border-radius:18px!important;padding:24px!important;display:flex!important;align-items:center!important}
.hubban-dashboard .hubban-coming-card .hubban-coming-content{max-width:72%!important}
/* Watch history is real data; retain it, but make it visually secondary. */
.hubban-dashboard .hubban-history-list{display:grid!important;gap:9px!important}
.hubban-dashboard .hubban-history-item{border-radius:14px!important}
@media(max-width:1300px){.hubban-dashboard .hubban-content{padding:26px 24px 34px!important}.hubban-dashboard .hubban-continue-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.hubban-dashboard .hubban-small-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}.hubban-dashboard .hubban-featured .hubban-series-caption h4{font-size:22px!important}.hubban-dashboard .hubban-search-wrapper{max-width:28vw!important}}
@media(max-width:900px){.hubban-dashboard .hubban-sidebar{width:175px!important;min-width:175px!important;flex-basis:175px!important;padding:22px 13px!important}.hubban-dashboard .hubban-logo{margin:4px 4px 24px!important}.hubban-dashboard .hubban-header{flex-wrap:wrap!important}.hubban-dashboard .hubban-header-right{width:100%!important;justify-content:space-between!important}.hubban-dashboard .hubban-search-wrapper{max-width:none!important;flex:1!important}.hubban-dashboard .hubban-featured{grid-template-columns:repeat(2,minmax(0,1fr))!important}.hubban-dashboard .hubban-bottom-grid{grid-template-columns:1fr!important}}
@media(max-width:650px){.hubban-dashboard{display:block!important}.hubban-dashboard .hubban-sidebar{width:100%!important;min-width:0!important;display:block!important;padding:15px!important}.hubban-dashboard .hubban-logo{margin:0 0 13px!important}.hubban-dashboard .hubban-logo img{width:125px!important}.hubban-dashboard .hubban-menu{display:flex!important;flex-direction:row!important;overflow-x:auto!important;flex-wrap:nowrap!important;gap:6px!important;padding-bottom:7px!important}.hubban-dashboard .hubban-sidebar .hubban-menu>a{flex:0 0 auto!important;font-size:12px!important;padding:0 12px!important;height:38px!important;min-height:38px!important}.hubban-dashboard .hubban-sidebar .hubban-menu>a:last-child{margin:0!important;padding-top:0!important;height:38px!important;border:0!important;border-radius:14px!important}.hubban-dashboard .hubban-premium{display:none!important}.hubban-dashboard .hubban-content{padding:20px 14px 30px!important}.hubban-dashboard .hubban-greeting h2{font-size:21px!important}.hubban-dashboard .hubban-header-right{gap:8px!important}.hubban-dashboard .hubban-search-wrapper{width:auto!important}.hubban-dashboard .hubban-continue-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}.hubban-dashboard .hubban-continue-grid>a.hubban-continue-card{aspect-ratio:1.28!important}.hubban-dashboard .hubban-continue-card .hubban-continue-body h4{font-size:12px!important}.hubban-dashboard .hubban-featured{grid-template-columns:1fr!important}.hubban-dashboard .hubban-featured>a.hubban-series-card{aspect-ratio:2.2!important}.hubban-dashboard .hubban-small-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.hubban-dashboard .hubban-reading-section .hubban-ebook-covers{grid-template-columns:repeat(2,minmax(0,1fr))!important}.hubban-dashboard .hubban-bottom-grid .hubban-ebook-list{grid-template-columns:repeat(3,minmax(0,1fr))!important}}

/* HUBBAN SIDEBAR ALIGNMENT FIX — Dashboard Anak only */
.hubban-dashboard .hubban-sidebar .hubban-menu{display:flex!important;flex-direction:column!important;gap:5px!important}
.hubban-dashboard .hubban-sidebar .hubban-menu>a{display:grid!important;grid-template-columns:22px minmax(0,1fr)!important;align-items:center!important;justify-content:start!important;column-gap:12px!important;text-align:left!important;min-height:46px!important;height:46px!important;padding:0 13px!important;font-size:14px!important;line-height:1.25!important;font-weight:650!important}
.hubban-dashboard .hubban-sidebar .hubban-menu>a .hubban-nav-icon{width:22px!important;height:22px!important;display:flex!important;align-items:center!important;justify-content:center!important;font-family:Arial,sans-serif!important;font-size:19px!important;font-weight:600!important;line-height:1!important;color:#626263!important}
.hubban-dashboard .hubban-sidebar .hubban-menu>a.active .hubban-nav-icon{color:#89591c!important}
.hubban-dashboard .hubban-sidebar .hubban-menu>a .hubban-nav-label{display:block!important;min-width:0!important;white-space:nowrap!important;font-size:13px!important}
.hubban-dashboard .hubban-sidebar .hubban-menu>a:last-child{margin-top:18px!important;padding-top:16px!important;height:65px!important;min-height:65px!important;border-top:1px solid #f1e9df!important}
@media(max-width:650px){.hubban-dashboard .hubban-sidebar .hubban-menu{flex-direction:row!important}.hubban-dashboard .hubban-sidebar .hubban-menu>a{display:flex!important;gap:7px!important;height:40px!important;min-height:40px!important;padding:0 12px!important}.hubban-dashboard .hubban-sidebar .hubban-menu>a:last-child{margin-top:0!important;padding-top:0!important;border-top:0!important;height:40px!important;min-height:40px!important}}



/* FIX SPACING WORDPRESS - DASHBOARD ANAK SAJA */

body.page-id-28 .wp-block-group[style*="padding-top"] {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}