
html,
body {
    margin: 0;
    padding: 0;
    background: #fff;
}

body.ojs-googminbiz-home-active {
    margin: 0 !important;
    padding: 0 !important;
    background: #fff !important;
}

body.ojs-googminbiz-home-active #wpadminbar {
    display: none !important;
}

.ojs-googminbiz-app,
.ojs-googminbiz-app * {
    box-sizing: border-box;
}

.ojs-googminbiz-app {
    width: 100%;
    min-height: 100vh;
    background: #fff;
    color: #202124;
    font-family: Arial, "Helvetica Neue", Helvetica, "Malgun Gothic", sans-serif;
}

.ojs-googminbiz-main {
    min-height: 100vh;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 16vh 22px 60px;
    background: #fff;
}

.ojs-googminbiz-center {
    width: 100%;
    max-width: 820px;
    text-align: center;
}

.ojs-googminbiz-logo {
    display: inline-block;
    text-decoration: none;
    font-size: clamp(72px, 10vw, 118px);
    font-weight: 700;
    letter-spacing: -7px;
    line-height: 0.95;
    margin: 0 0 38px;
    user-select: none;
    color: #4065B4;
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
}


.ojs-googminbiz-search-shell {
    width:100%;
    border:1px solid #dfe1e5;
    border-radius:30px;
    background:#fff;
    box-shadow:0 1px 8px rgba(32,33,36,.20);
    overflow:visible;
    position:relative;
}

.ojs-googminbiz-search-shell:focus-within {
    box-shadow:0 1px 10px rgba(32,33,36,.28);
}

.ojs-googminbiz-flow-row {
    min-height:48px;
    display:flex;
    align-items:center;
    gap:8px;
    padding:5px 8px 5px 16px;
    border-bottom:1px solid #edf0f3;
    background:#fff;
}

.ojs-googminbiz-flow-window {
    flex:1;
    min-width:0;
    overflow:hidden;
    white-space:nowrap;
    mask-image:linear-gradient(to right,transparent,#000 3%,#000 97%,transparent);
    -webkit-mask-image:linear-gradient(to right,transparent,#000 3%,#000 97%,transparent);
}

.ojs-googminbiz-flow-track {
    display:inline-flex;
    align-items:center;
    white-space:nowrap;
    width:max-content;
    color:#5f6368;
    font-size:22px;
    font-weight:500;
    line-height:1.2;
    will-change:transform;
    transform:translate3d(0,0,0);
}

.ojs-googminbiz-flow-copy {
    display:inline-flex;
    align-items:center;
    gap:18px;
    padding-right:18px;
}

.ojs-flow-link {
    display:inline-flex;
    align-items:center;
    gap:6px;
    text-decoration:none;
    color:#5f6368;
    padding:2px 4px;
    border-radius:12px;
    transition:background .15s ease,color .15s ease;
}

.ojs-flow-link:hover,
.ojs-flow-link:focus {
    background:#eef4ff;
    color:#4065B4;
    outline:none;
}

.ojs-flow-no {
    font-weight:700;
    color:#4065B4;
}

.ojs-googminbiz-flow-settings {
    flex:0 0 auto;
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
}

.ojs-flow-settings-toggle {
    width:34px;
    height:34px;
    border:0;
    border-radius:50%;
    background:#f4f7fb;
    color:#4065B4;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    padding:7px;
}

.ojs-flow-settings-toggle:hover,
.ojs-flow-settings-toggle[aria-expanded="true"] {
    background:#eaf1ff;
}

.ojs-flow-settings-toggle svg {
    width:20px;
    height:20px;
    display:block;
}

.ojs-flow-settings-panel {
    position:absolute;
    right:0;
    top:42px;
    z-index:10020;
    width:max-content;
    min-width:214px;
    padding:10px 12px;
    border:1px solid #dfe1e5;
    border-radius:16px;
    background:#fff;
    box-shadow:0 8px 24px rgba(32,33,36,.18);
    color:#5f6368;
}

.ojs-flow-settings-panel[hidden] {
    display:none;
}

.ojs-flow-panel-line {
    display:flex;
    align-items:center;
    gap:5px;
    min-height:34px;
}

.ojs-flow-panel-line + .ojs-flow-panel-line {
    margin-top:5px;
    padding-top:7px;
    border-top:1px solid #eef1f4;
}

.ojs-flow-panel-label {
    width:34px;
    font-size:12px;
    font-weight:700;
    color:#7b818a;
    text-align:left;
}

.ojs-flow-btn,
.ojs-flow-speed {
    border:0;
    background:transparent;
    color:#7b818a;
    min-width:29px;
    height:29px;
    padding:0 6px;
    border-radius:15px;
    cursor:pointer;
    font-size:13px;
    font-weight:700;
}

.ojs-flow-btn:hover,
.ojs-flow-speed:hover,
.ojs-flow-btn.is-active,
.ojs-flow-speed.is-active {
    background:#eef4ff;
    color:#4065B4;
}

.ojs-flow-speed-set {
    display:inline-flex;
    align-items:center;
    gap:2px;
}

.ojs-googminbiz-search {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 9px 10px 9px 14px;
    border: 0;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
}

.ojs-googminbiz-voice {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 0;
    background: transparent;
    color: #5f6368;
    font-size: 23px;
    cursor: pointer;
    flex: 0 0 auto;
}

.ojs-googminbiz-search input[type="search"] {
    flex: 1;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    font-size: 28px;
    padding: 12px 4px;
    color: #202124;
    -webkit-appearance: none;
    appearance: none;
}

.ojs-googminbiz-search input[type="search"]::-webkit-search-cancel-button {
    display: none;
}

.ojs-googminbiz-submit {
    width:48px;
    height:48px;
    min-width:48px;
    border:0;
    border-radius:50%;
    background:#4285F4;
    color:#fff;
    padding:0;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    flex:0 0 auto;
}

.ojs-googminbiz-submit svg {
    width:24px;
    height:24px;
    display:block;
}


.ojs-googminbiz-public-slot {

    display: none;
    margin: 44px auto 0;
    max-width: 680px;
}

.ojs-googminbiz-public-slot.is-visible {
    display: block;
}

.ojs-googminbiz-card {
    text-align: left;
    border: 1px solid #e2e8f0;
    border-radius: 20px;
    background: #fff;
    padding: 22px 24px;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .06);
}

.ojs-googminbiz-eyebrow {
    font-size: 11px;
    color: #7c3aed;
    font-weight: 900;
    margin-bottom: 7px;
}

.ojs-googminbiz-card h2 {
    font-size: 21px;
    margin: 0 0 8px;
    color: #0f172a;
}

.ojs-googminbiz-card p {
    margin: 0;
    color: #64748b;
    line-height: 1.65;
}

.ojs-googminbiz-card-link {
    display: inline-block;
    margin-top: 14px;
    color: #4285F4;
    font-weight: 800;
    text-decoration: none;
}

@media (max-width: 640px) {
    .ojs-googminbiz-main {
        padding: 11vh 12px 86px;
    }

    .ojs-googminbiz-logo {
        font-size: clamp(56px, 18vw, 88px);
        letter-spacing: -4px;
        margin-bottom: 24px;
    }

    .ojs-googminbiz-flow-row {
        min-height:44px;
        padding:4px 6px 4px 10px;
        gap:4px;
    }

    .ojs-googminbiz-flow-track {
        font-size:18px;
    }

    .ojs-googminbiz-flow-copy {
        gap:10px;
        padding-right:10px;
    }

    .ojs-flow-settings-toggle {
        width:32px;
        height:32px;
        padding:7px;
    }

    .ojs-flow-settings-panel {
        right:0;
        top:38px;
        min-width:210px;
        max-width:calc(100vw - 34px);
        border-radius:14px;
        padding:9px 10px;
    }

    .ojs-flow-btn,
    .ojs-flow-speed {
        min-width:28px;
        width:28px;
        height:28px;
        padding:0;
        font-size:12px;
    }

    .ojs-googminbiz-search {
        padding: 6px 8px 6px 8px;
        gap: 4px;
    }

    .ojs-googminbiz-voice {
        width: 40px;
        height: 40px;
        font-size: 18px;
    }

    .ojs-googminbiz-search input[type="search"] {
        font-size: 20px;
        padding: 10px 2px;
    }

    .ojs-googminbiz-submit {
        width:44px;
        height:44px;
        min-width:44px;
        padding:0;
    }

    .ojs-googminbiz-submit svg {
        width:23px;
        height:23px;
    }


    .ojs-googminbiz-public-slot {
        margin-top: 28px;
    }

    .ojs-googminbiz-card {
        border-radius: 16px;
        padding: 18px;
    }

    .ojs-googminbiz-card h2 {
        font-size: 18px;
    }
}



/* ===== OJS DOM SPLIT FINAL ===== */



/* 두 영역을 함께 감싸던 기존 큰 박스 제거 */

.ojs-split-shell {

    background: transparent !important;

    border: 0 !important;

    box-shadow: none !important;

    border-radius: 0 !important;

    overflow: visible !important;

}



/* 상단 흐르는 메뉴는 글자만 */

.ojs-flow-only,

.ojs-flow-clean {

    background: transparent !important;

    border: 0 !important;

    border-top: 0 !important;

    border-bottom: 0 !important;

    box-shadow: none !important;

    border-radius: 0 !important;

}



.ojs-flow-only {

    overflow: visible !important;

    margin-bottom: 14px !important;

}



/* 하단 검색줄만 독립된 Google형 oval */

.ojs-search-only {

    box-sizing: border-box !important;

    background: #ffffff !important;

    border: 1px solid #dfe1e5 !important;

    border-radius: 999px !important;

    overflow: hidden !important;



    box-shadow:

        0 5px 16px rgba(60,64,67,.16),

        0 1px 3px rgba(60,64,67,.08) !important;

}



/* 검색 입력 자체의 불필요한 테두리 제거 */

.ojs-search-only input[type="search"] {

    background: transparent !important;

    border: 0 !important;

    outline: 0 !important;

    box-shadow: none !important;

}



/* 모바일도 동일 */

@media (max-width: 768px) {

    .ojs-flow-only {

        margin-bottom: 10px !important;

    }



    .ojs-search-only {

        border-radius: 999px !important;

    }

}

