/*
 * LottoMate generator screen renewal
 * Path: /var/www/lottomate/assets/css/generator_gold_screen.css
 * Scope: generator.php visual refinement only
 */

body{
    background:
        radial-gradient(circle at 18% 0%,rgba(255,244,189,.50),transparent 30%),
        linear-gradient(180deg,#fff 0%,#f7f6f2 50%,#fff 100%) !important;
}

.generator-page,
.generator-wrap,
.gen-page,
main{
    letter-spacing:-.035em;
}

.generator-hero,
.gen-hero,
.page-head,
.public-page-head{
    position:relative;
    overflow:hidden;
    border-radius:24px !important;
    border:1px solid rgba(217,164,65,.56) !important;
    background:
        radial-gradient(circle at 74% 30%,rgba(255,220,80,.26),transparent 24%),
        radial-gradient(circle at 95% 92%,rgba(217,164,65,.24),transparent 24%),
        linear-gradient(115deg,#080604 0%,#1b1409 48%,#503509 78%,#c9952f 100%) !important;
    color:#fff !important;
    box-shadow:0 18px 44px rgba(99,65,6,.22) !important;
    padding:34px !important;
    margin-bottom:16px !important;
}

.generator-hero::after,
.gen-hero::after,
.page-head::after,
.public-page-head::after{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(90deg,rgba(8,6,4,.82),rgba(8,6,4,.28),rgba(8,6,4,.08)),
        repeating-linear-gradient(135deg,rgba(255,255,255,.045) 0 1px,transparent 1px 24px);
    pointer-events:none;
}

.generator-hero > *,
.gen-hero > *,
.page-head > *,
.public-page-head > *{
    position:relative;
    z-index:2;
}

.generator-hero h1,
.gen-hero h1,
.page-head h1,
.public-page-head h1{
    color:#fff8d9 !important;
    font-size:38px !important;
    line-height:1.14 !important;
    letter-spacing:-.075em !important;
    text-shadow:0 3px 16px rgba(0,0,0,.42) !important;
}

.generator-hero p,
.gen-hero p,
.page-head p,
.public-page-head p{
    color:rgba(255,255,255,.82) !important;
    font-weight:800 !important;
    line-height:1.65 !important;
}

.gen-label,
.label,
.badge{
    display:inline-flex;
    align-items:center;
    height:30px;
    border-radius:999px !important;
    padding:0 12px !important;
    background:rgba(255,231,151,.14) !important;
    border:1px solid rgba(255,231,151,.38) !important;
    color:#ffe9a3 !important;
    font-size:14px !important;
    font-weight:950 !important;
}

.generator-layout,
.gen-layout,
.generator-grid{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) 340px !important;
    gap:16px !important;
    align-items:start !important;
}

.gen-card,
.generator-card,
.result-card,
.condition-card,
.status-card,
.number-card{
    background:#fff !important;
    border:1px solid #ead9aa !important;
    border-radius:20px !important;
    box-shadow:0 8px 20px rgba(68,44,6,.08) !important;
}

.gen-card,
.generator-card,
.result-card,
.condition-card,
.status-card{
    padding:22px !important;
}

.gen-card-head,
.card-head,
.result-head{
    display:flex !important;
    align-items:flex-start !important;
    justify-content:space-between !important;
    gap:12px !important;
    flex-wrap:wrap !important;
    margin-bottom:18px !important;
}

.gen-card h2,
.generator-card h2,
.result-card h2,
.condition-card h2,
.status-card h2,
.gen-card-head h2{
    margin:0 !important;
    color:#071d3a !important;
    font-size:23px !important;
    font-weight:950 !important;
    letter-spacing:-.06em !important;
}

.gen-form-grid,
.generator-form-grid,
.form-grid{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:14px !important;
}

.gen-form-grid label,
.generator-form-grid label,
.form-grid label,
.form-field{
    display:grid !important;
    gap:7px !important;
    color:#334155 !important;
    font-size:14px !important;
    font-weight:950 !important;
}

.gen-form-grid input,
.gen-form-grid select,
.gen-form-grid textarea,
.generator-form-grid input,
.generator-form-grid select,
.generator-form-grid textarea,
.form-grid input,
.form-grid select,
.form-grid textarea{
    min-height:44px !important;
    border:1px solid #d1d5db !important;
    border-radius:13px !important;
    background:#fff !important;
    padding:0 13px !important;
    color:#111827 !important;
    font-weight:900 !important;
    box-shadow:inset 0 1px 0 rgba(15,23,42,.03) !important;
}

.gen-form-grid textarea,
.generator-form-grid textarea,
.form-grid textarea{
    padding:12px 13px !important;
    line-height:1.6 !important;
}

.gen-form-grid input:focus,
.gen-form-grid select:focus,
.gen-form-grid textarea:focus,
.generator-form-grid input:focus,
.generator-form-grid select:focus,
.generator-form-grid textarea:focus{
    outline:none !important;
    border-color:#d9a441 !important;
    box-shadow:0 0 0 4px rgba(217,164,65,.16) !important;
}

.gen-actions,
.generator-actions,
.form-actions{
    display:flex !important;
    align-items:center !important;
    gap:8px !important;
    flex-wrap:wrap !important;
    margin-top:18px !important;
}

.gen-btn,
.btn,
.mini-btn,
.bulk-save-btn,
button[type="submit"],
input[type="submit"]{
    border-radius:999px !important;
    font-weight:950 !important;
    min-height:40px !important;
    padding:0 18px !important;
    border:1px solid transparent !important;
    transition:transform .18s ease, box-shadow .18s ease, background .18s ease !important;
}

.gen-btn:hover,
.btn:hover,
.mini-btn:hover,
.bulk-save-btn:hover,
button[type="submit"]:hover{
    transform:translateY(-1px) !important;
    box-shadow:0 12px 24px rgba(68,44,6,.18) !important;
}

.gen-btn.gold,
.btn.gold,
.mini-btn.gold,
.bulk-save-btn,
button[type="submit"]{
    background:linear-gradient(135deg,#fff3b0,#d9a441) !important;
    color:#3b2500 !important;
    border-color:#d9a441 !important;
    box-shadow:0 10px 18px rgba(99,65,6,.16) !important;
}

.gen-btn.dark,
.btn.dark,
.btn.blue{
    background:#071d3a !important;
    color:#fff !important;
}

.gen-btn.light,
.btn.light,
.mini-btn{
    background:#fff !important;
    color:#071d3a !important;
    border-color:#e5e7eb !important;
}

.usage-box,
.member-status,
.generator-status,
.limit-card{
    border-radius:18px !important;
    background:
        radial-gradient(circle at 94% 10%,rgba(255,220,80,.22),transparent 28%),
        linear-gradient(135deg,#071d3a,#092b58) !important;
    color:#fff !important;
    border:1px solid rgba(217,164,65,.42) !important;
    box-shadow:0 12px 28px rgba(7,29,58,.18) !important;
    padding:18px !important;
}

.usage-box strong,
.member-status strong,
.generator-status strong,
.limit-card strong{
    color:#fff4bd !important;
    font-size:22px !important;
    font-weight:950 !important;
}

.usage-box span,
.member-status span,
.generator-status span,
.limit-card span,
.usage-box p,
.member-status p,
.generator-status p,
.limit-card p{
    color:#dbe7f7 !important;
    font-weight:800 !important;
}

.result-list,
.bulk-save-form{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:12px !important;
}

.bulk-toolbar,
.bulk-footer{
    grid-column:1/-1 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:10px !important;
    flex-wrap:wrap !important;
    border:1px solid #ead9aa !important;
    background:#fff8d9 !important;
    border-radius:16px !important;
    padding:12px !important;
}

.select-all,
.bulk-check{
    display:inline-flex !important;
    align-items:center !important;
    gap:7px !important;
    font-weight:950 !important;
    color:#3b2500 !important;
}

.select-all input,
.bulk-check input{
    width:18px !important;
    height:18px !important;
    accent-color:#d9a441 !important;
}

.number-card{
    padding:16px !important;
    position:relative !important;
    overflow:hidden !important;
}

.number-card::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(135deg,rgba(255,248,217,.55),transparent 45%);
    pointer-events:none;
}

.number-card > *{
    position:relative;
    z-index:2;
}

.number-head{
    display:flex !important;
    align-items:flex-start !important;
    justify-content:space-between !important;
    gap:8px !important;
    flex-wrap:wrap !important;
    margin-bottom:10px !important;
}

.number-head strong{
    color:#071d3a !important;
    font-size:18px !important;
    font-weight:950 !important;
}

.number-head span{
    color:#64748b !important;
    font-size:12px !important;
    font-weight:900 !important;
}

.balls,
.num-balls,
.mini-balls{
    display:flex !important;
    align-items:center !important;
    gap:7px !important;
    flex-wrap:wrap !important;
}

.ball,
.mini-ball,
.neon,
.lotto-ball,
.num-ball,
.round-ball{
    width:44px !important;
    height:44px !important;
    min-width:44px !important;
    border-radius:50% !important;
    display:inline-grid !important;
    place-items:center !important;
    position:relative !important;
    isolation:isolate !important;
    overflow:hidden !important;
    color:#fff !important;
    font-size:16px !important;
    font-weight:950 !important;
    line-height:1 !important;
    border:1px solid rgba(255,255,255,.86) !important;
    text-shadow:0 1px 2px rgba(0,0,0,.50) !important;
    box-shadow:
        inset 0 3px 5px rgba(255,255,255,.33),
        inset 0 -11px 15px rgba(0,0,0,.22),
        0 8px 16px rgba(15,23,42,.16) !important;
}

.ball::before,
.mini-ball::before,
.neon::before,
.lotto-ball::before,
.num-ball::before,
.round-ball::before{
    content:"";
    position:absolute;
    left:9px;
    top:7px;
    width:16px;
    height:10px;
    border-radius:50%;
    background:rgba(255,255,255,.34);
    filter:blur(.2px);
    z-index:-1;
}

.ball.yellow,
.ball.orange,
.ball.mb1,
.ball.b1,
.mini-ball.yellow,
.mini-ball.orange,
.mini-ball.mb1,
.mini-ball.b1{
    background:radial-gradient(circle at 30% 24%,#fff7b8 0 13%,#ffd75a 33%,#f4b400 72%,#b87500 100%) !important;
}

.ball.blue,
.ball.mb2,
.ball.b2,
.mini-ball.blue,
.mini-ball.mb2,
.mini-ball.b2{
    background:radial-gradient(circle at 30% 24%,#dbeafe 0 13%,#67a8ff 33%,#2563eb 74%,#123a91 100%) !important;
}

.ball.red,
.ball.mb3,
.ball.b3,
.mini-ball.red,
.mini-ball.mb3,
.mini-ball.b3{
    background:radial-gradient(circle at 30% 24%,#ffe1e1 0 13%,#ff8383 33%,#e53935 74%,#a81515 100%) !important;
}

.ball.gray,
.ball.purple,
.ball.mb4,
.ball.b4,
.mini-ball.gray,
.mini-ball.purple,
.mini-ball.mb4,
.mini-ball.b4{
    background:radial-gradient(circle at 30% 24%,#f3f4f6 0 13%,#a9b0bb 34%,#5f6978 74%,#303846 100%) !important;
}

.ball.green,
.ball.mb5,
.ball.b5,
.mini-ball.green,
.mini-ball.mb5,
.mini-ball.b5{
    background:radial-gradient(circle at 30% 24%,#dcfce7 0 13%,#7fe78d 34%,#16a34a 74%,#0f6b31 100%) !important;
}

.empty,
.empty-result,
.result-empty{
    border:1px dashed #ead9aa !important;
    background:#fffaf0 !important;
    border-radius:18px !important;
    padding:34px 18px !important;
    color:#64748b !important;
    font-weight:900 !important;
    text-align:center !important;
}

@media(max-width:980px){
    .generator-layout,
    .gen-layout,
    .generator-grid{
        grid-template-columns:1fr !important;
    }
    .gen-form-grid,
    .generator-form-grid,
    .form-grid,
    .result-list,
    .bulk-save-form{
        grid-template-columns:1fr !important;
    }
}

@media(max-width:640px){
    .generator-hero,
    .gen-hero,
    .page-head,
    .public-page-head{
        padding:24px 18px !important;
        border-radius:20px !important;
    }

    .generator-hero h1,
    .gen-hero h1,
    .page-head h1,
    .public-page-head h1{
        font-size:30px !important;
    }

    .gen-card,
    .generator-card,
    .result-card,
    .condition-card,
    .status-card{
        padding:18px !important;
    }

    .ball,
    .mini-ball,
    .neon,
    .lotto-ball,
    .num-ball,
    .round-ball{
        width:38px !important;
        height:38px !important;
        min-width:38px !important;
        font-size:14px !important;
    }
}


/* ===== generator width alignment fix 20260520 ===== */
/*
 * 번호생성기 상단 "골드 기능 보기 / 내 저장번호" 버튼 영역과
 * 본문 카드 폭이 다른 고객화면보다 넓어 보이는 문제 보정.
 */

.generator-page,
.gen-page,
.generator-wrap,
.gen-wrap,
.generator-container,
.generator-main,
main.generator-page{
    width:100% !important;
}

.generator-page > .wrap,
.gen-page > .wrap,
.generator-main > .wrap,
.generator-wrap,
.gen-wrap,
.generator-container,
main .generator-wrap,
main .gen-wrap,
main .generator-container{
    width:min(1180px, calc(100% - 36px)) !important;
    max-width:1180px !important;
    margin-left:auto !important;
    margin-right:auto !important;
}

.generator-hero,
.gen-hero,
.generator-page .page-head,
.generator-page .public-page-head{
    width:100% !important;
    max-width:1180px !important;
    margin-left:auto !important;
    margin-right:auto !important;
}

.generator-hero .gen-actions,
.generator-hero .generator-actions,
.generator-hero .hero-actions,
.gen-hero .gen-actions,
.gen-hero .generator-actions,
.gen-hero .hero-actions,
.generator-page .page-head .gen-actions,
.generator-page .page-head .generator-actions,
.generator-page .page-head .hero-actions{
    width:auto !important;
    max-width:100% !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:10px !important;
    flex-wrap:wrap !important;
}

.generator-hero .gen-actions a,
.generator-hero .generator-actions a,
.generator-hero .hero-actions a,
.gen-hero .gen-actions a,
.gen-hero .generator-actions a,
.gen-hero .hero-actions a,
.generator-page .page-head .gen-actions a,
.generator-page .page-head .generator-actions a,
.generator-page .page-head .hero-actions a{
    width:auto !important;
    min-width:150px !important;
    max-width:210px !important;
    flex:0 0 auto !important;
    white-space:nowrap !important;
}

.generator-layout,
.gen-layout,
.generator-grid{
    width:100% !important;
    max-width:1180px !important;
    margin-left:auto !important;
    margin-right:auto !important;
}

@media(max-width:640px){
    .generator-page > .wrap,
    .gen-page > .wrap,
    .generator-main > .wrap,
    .generator-wrap,
    .gen-wrap,
    .generator-container,
    main .generator-wrap,
    main .gen-wrap,
    main .generator-container{
        width:min(100% - 28px, 1180px) !important;
    }

    .generator-hero .gen-actions a,
    .generator-hero .generator-actions a,
    .generator-hero .hero-actions a,
    .gen-hero .gen-actions a,
    .gen-hero .generator-actions a,
    .gen-hero .hero-actions a,
    .generator-page .page-head .gen-actions a,
    .generator-page .page-head .generator-actions a,
    .generator-page .page-head .hero-actions a{
        width:100% !important;
        max-width:100% !important;
    }
}
/* ===== //generator width alignment fix 20260520 ===== */