/* ==========================================================================
   Site theme — Emerald Fresh
   --------------------------------------------------------------------------
   Re-skins the public pages (landing, charts, guessing forum, guesser login,
   info pages) without touching their markup, data or scripts. Every rule is
   prefixed with `html body` so it outranks the pages' own <style> blocks,
   including the ones that sit further down inside <body>.
   Remove the <link> to this file (resources/views/front/_theme.blade.php)
   and the pages look exactly as before.
   ========================================================================== */

:root {
    --th-bg: #eefaf4;
    --th-bg-2: #d9f2e6;
    --th-card: #ffffff;
    --th-line: #cdebdd;
    --th-line-2: #a3d9c1;
    --th-accent: #0d9488;
    --th-accent-2: #2dd4bf;
    --th-accent-soft: #e3f6ef;
    --th-primary: #047857;
    --th-primary-2: #059669;
    --th-primary-dark: #064e3b;
    --th-text: #0f2e25;
    --th-muted: #4b6b60;
    --th-result: #0f766e;
    --th-hot: #dc2626;
    --th-radius: 14px;
    --th-shadow: 0 6px 18px rgba(6, 78, 59, .08);
    --th-bar: linear-gradient(135deg, #047857 0%, #0d9488 100%);
    --th-bar-accent: linear-gradient(135deg, #a7f3d0 0%, #5eead4 100%);
}

/* ---------- Base ---------- */
html body {
    background: var(--th-bg) linear-gradient(180deg, #d6f2e5 0, var(--th-bg) 320px) no-repeat;
    color: var(--th-text);
    font-family: 'Poppins', 'Hind', system-ui, -apple-system, 'Segoe UI', sans-serif;
    font-weight: 500;
    padding: 6px 10px;
}

html body,
html body * {
    font-style: normal !important;
    text-shadow: none !important;
}

html body p,
html body h1,
html body h2,
html body h3,
html body h4,
html body h5,
html body h6 {
    color: var(--th-text);
}

html body a {
    color: var(--th-primary);
}

/* Content saved from the old editor carries its own inline colours/fonts. */
html body [style*="font-family"] {
    font-family: inherit !important;
}

html body [style*="background-color: rgb(255, 204, 153)"] {
    background-color: transparent !important;
}

html body [style*="background-color: rgb(0, 139, 139)"] {
    background-color: transparent !important;
    color: var(--th-primary) !important;
}

html body font[color="blue"],
html body font[color="#0000ff"],
html body [style*="color: blue"],
html body [style*="color:blue"] {
    color: var(--th-primary) !important;
}

/* ---------- Cards (every bordered legacy box) ---------- */
html body :is(.logo, .para1, .para2, .para3, .dp-topbox, .satta-text, .cm-patti, .matka-result,
    .mrque-div, .paid-gm, .purpel-header, .red-list > div, .satta-result, .slash-text, .conta,
    .blue-div, .about-us, .disclamer, .faq, .ftr-sm, .let-rock, .bdr, .paa3) {
    background: var(--th-card) !important;
    border: 1px solid var(--th-line) !important;
    border-radius: var(--th-radius) !important;
    box-shadow: var(--th-shadow) !important;
    outline: 0 !important;
    color: var(--th-text);
    margin-bottom: 10px;
    overflow: hidden;
}

/* The first card is the brand header: give it a maroon crown. */
html body .logo {
    border-top: 4px solid var(--th-primary) !important;
    padding: 6px 10px 10px;
}

html body .logo p,
html body .logo h1,
html body .logo h2 {
    color: var(--th-primary-dark) !important;
}

html body .para1 .mrque-div,
html body .para1 {
    border-left: 4px solid var(--th-accent) !important;
}

html body .mrque-div p,
html body .mrque-div marquee {
    color: var(--th-primary) !important;
}

html body .para1 .mrque-div {
    border: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    margin: 0 !important;
}

html body .mrque-div img {
    border-radius: 10px;
}

html body .para2 h1,
html body .para2 h2,
html body .para2 p,
html body .satta-text h1 {
    color: var(--th-primary-dark) !important;
}

html body .para2 h2,
html body .satta-text p,
html body .para3 {
    color: var(--th-muted) !important;
}

html body .para3 {
    background: var(--th-accent-soft) !important;
}

html body .para3 a {
    color: var(--th-primary) !important;
    font-weight: 600;
}

/* ---------- Section title bars ---------- */
html body :is(.a-27-title, .banner, .cm-patti h3, .cm-patti h6, .fg-div h6, .matka-result h4, .matka-result h6,
    .my-table.mumraj-sl h4, .my-table.mumraj-sl h6, .blue-div h4, .red-list h4, .red-list-bg-change,
    .purpel-header h6, .disclamer h6, .pby-us, .paid-gm h4) {
    background: var(--th-bar) !important;
    color: #fff !important;
    border: 0 !important;
    border-bottom: 3px solid var(--th-accent) !important;
    border-radius: 12px !important;
    animation: none !important;
    clip-path: none !important;
    letter-spacing: .5px;
    font-weight: 600 !important;
    padding: 8px 12px !important;
    margin: 6px 6px 8px !important;
}

html body :is(.a-27-title, .banner, .red-list-bg-change, .pby-us) {
    margin: 0 0 10px !important;
}

html body :is(.a-27-title, .banner, .red-list-bg-change, .pby-us, .purpel-header h6) :is(a, span, h1, h2, h3) {
    color: #fff !important;
}

html body .pby-us {
    font-size: 20px;
}

/* Gold bars (starline headings) */
html body :is(.my-table.cm-sl h4, .my-table.mr-sl h4) {
    background: var(--th-bar-accent) !important;
    color: var(--th-primary-dark) !important;
    border: 0 !important;
    border-radius: 12px 12px 0 0 !important;
    font-weight: 700 !important;
    padding: 8px 12px !important;
    margin: 12px 0 0 !important;
}

/* ---------- Today Lucky Number ---------- */
html body .cm-patti h4 {
    color: var(--th-primary) !important;
}

html body .cm-patti p {
    color: var(--th-result) !important;
    font-weight: 700;
}

html body .cm-patti .aa55,
html body .cm-patti .bb55 {
    border-color: var(--th-line) !important;
}

/* ---------- Live result box ---------- */
html body .matka-card .gn {
    color: var(--th-primary-dark) !important;
    font-weight: 700;
}

html body .matka-card .gn:not(:first-child) {
    border-top: 1px solid var(--th-line) !important;
}

html body .matka-card .gr {
    color: var(--th-result) !important;
    font-weight: 700;
}

html body .live-alert,
html body .live-box p {
    color: var(--th-text) !important;
}

html body :is(.matka-card button, .refresh-btn, .btn_chart, .about-us span, .live-box a[style]) {
    background: var(--th-bar) !important;
    color: #fff !important;
    border: 1px solid var(--th-accent) !important;
    border-radius: 999px !important;
    font-weight: 600;
    box-shadow: 0 2px 6px rgba(6, 78, 59, .18);
}

html body .install-btn {
    background: var(--th-bar) !important;
    border-radius: 999px;
}

/* ---------- Market results list ---------- */
html body .satta-result {
    padding: 0 !important;
}

html body .satta-result div {
    border-bottom: 1px solid var(--th-line) !important;
    padding: 8px 4px 10px;
}

html body .satta-result h4 {
    color: var(--th-primary-dark) !important;
    font-weight: 700;
    letter-spacing: .3px;
}

html body .satta-result span {
    background: none !important;
    -webkit-text-fill-color: var(--th-result) !important;
    color: var(--th-result) !important;
    font-weight: 700;
    letter-spacing: 1px;
}

html body .satta-result p {
    color: var(--th-muted) !important;
    font-weight: 500;
}

html body .satta-result .yellowbg,
html body .yellowbg {
    background: var(--th-accent-soft) !important;
    border-left: 4px solid var(--th-accent) !important;
    border-bottom: 1px solid var(--th-line-2) !important;
}

html body .btn_chart {
    font-size: 12px;
    padding: 4px 12px !important;
}

/* ---------- Contact + login buttons ---------- */
html body .conta {
    background: var(--th-accent-soft) !important;
}

html body .conta p {
    color: var(--th-primary-dark) !important;
}

html body .conta a {
    background: var(--th-bar-accent) !important;
    color: var(--th-primary-dark) !important;
    border: 1px solid var(--th-accent) !important;
    border-radius: 999px !important;
    box-shadow: 0 2px 8px rgba(13, 148, 136, .35) !important;
    font-weight: 700;
}

html body .conta a:hover {
    background: var(--th-bar) !important;
    color: #fff !important;
}

/* ---------- Starline tables & other data tables ---------- */
html body .my-table table,
html body table {
    box-shadow: var(--th-shadow);
}

html body :is(.my-table td, .my-table th) {
    border: 1px solid var(--th-line) !important;
    color: var(--th-text);
    background: #fff;
}

html body .my-table thead th,
html body .my-table thead {
    background: var(--th-accent-soft) !important;
    color: var(--th-primary-dark) !important;
}

html body .my-table tr td:nth-child(2),
html body .my-table tr td:nth-child(4) {
    color: var(--th-result) !important;
}

/* ---------- Special game zone / weekly boxes ---------- */
html body .blue-div a {
    background: none !important;
    -webkit-text-fill-color: var(--th-primary) !important;
    color: var(--th-primary) !important;
    animation: none !important;
    border-bottom: 1px solid var(--th-line) !important;
    font-weight: 600;
}

html body .red-list p {
    color: var(--th-text) !important;
    font-weight: 600;
}

html body .red-list p:nth-child(even) {
    background: #f3fbf7;
}

/* ---------- Free game zone ---------- */
html body .fg-div h4,
html body .fg-div h4 * {
    background-color: transparent;
}

html body .fg-div > h4 {
    background: var(--th-bar) !important;
    border: 0 !important;
    border-bottom: 3px solid var(--th-accent) !important;
    border-radius: var(--th-radius) !important;
    color: #fff !important;
    padding: 8px !important;
}

html body .fg-div > h4 :is(h1, h2, h3, h4, h5, p, span, div) {
    color: #fff !important;
    background: transparent !important;
}

html body .fg-div > h4 hr {
    border-color: rgba(45, 212, 191, .6);
}

html body .card-1212 {
    border-radius: var(--th-radius) !important;
    border: 1px solid var(--th-line);
}

html body .fg-c1 {
    border-color: var(--th-line) !important;
    background: #fff;
}

html body .fg-div .fg-c1 .fg-p2 {
    background: var(--th-bar) !important;
    clip-path: none !important;
    border-radius: 999px !important;
    border-bottom: 2px solid var(--th-accent);
    color: #fff !important;
}

html body .fg-div .fg-c1 .fg-p2 * {
    color: #fff !important;
}

html body .fg-div .fg-c1 :is(.fg-p3, .fg-p4, p:not(.fg-p2)) {
    color: var(--th-primary-dark) !important;
}

html body .fg-div .fg-c1 > div {
    border-color: var(--th-line-2) !important;
}

/* ---------- Kalyan weekly patti tables ---------- */
html body .new-table-add {
    border: 1px solid var(--th-primary) !important;
    border-radius: 10px;
    overflow: hidden;
}

html body .new-table-add td {
    border: 1px solid var(--th-line) !important;
    background: #fff;
}

html body .ntah {
    background: var(--th-bar-accent) !important;
    color: var(--th-primary-dark) !important;
}

html body .ntah-blue-sec {
    color: var(--th-primary) !important;
}

html body .ntah-red-sec {
    color: var(--th-hot) !important;
}

/* ---------- Jodi / panel chart link lists ---------- */
html body :is(.ab1, .ab2) {
    border-color: var(--th-line) !important;
}

html body :is(.ab1 a, .ab2 a, .purpel-header a) {
    color: var(--th-primary-dark) !important;
    border-bottom: 1px solid var(--th-line) !important;
    font-weight: 600;
    transition: background .2s;
}

html body :is(.ab1 a, .ab2 a, .purpel-header a):hover {
    background: var(--th-accent-soft);
    color: var(--th-primary) !important;
}

/* ---------- FAQ, articles, footer ---------- */
html body :is(.faq label, .faq h4, .let-rock .t-rock, .ftr-sm h4, .ftr-sm h2) {
    color: var(--th-primary) !important;
}

html body :is(.faq-card, .let-rock .t-rock) {
    border-color: var(--th-line) !important;
}

html body :is(.faq p, .let-rock p, .let-rock i, .about-us p, .disclamer p) {
    color: var(--th-text) !important;
    font-weight: 500;
}

html body :is(.faq a, .let-rock a, .about-us b) {
    color: var(--th-primary) !important;
}

html body .about-us a {
    background: var(--th-primary) !important;
    color: #fff !important;
    border-radius: 6px;
}

html body .let-rock ul {
    border-color: var(--th-line-2) !important;
}

html body .ftr-sm p,
html body .ftr-sm a {
    color: var(--th-muted) !important;
}

html body .ftr-sm a:hover {
    color: var(--th-primary) !important;
}

/* ---------- Floating buttons ---------- */
html body :is(.mp-btn, .mp-btn-2nd, .btm-btn-f) {
    background: var(--th-bar) !important;
    color: #fff !important;
    border: 1px solid var(--th-accent) !important;
    border-radius: 999px !important;
    box-shadow: 0 4px 12px rgba(6, 78, 59, .3) !important;
}

html body .btm-btn-f:hover {
    background: var(--th-bar-accent) !important;
    color: var(--th-primary-dark) !important;
}

/* ==========================================================================
   Jodi / Panel chart pages
   ========================================================================== */
html body .chart-h1,
html body .panel-heading h1 {
    background: var(--th-bar) !important;
    color: #fff !important;
    border: 0 !important;
    border-bottom: 3px solid var(--th-accent) !important;
    border-radius: 12px !important;
    font-weight: 600 !important;
    padding: 8px 12px !important;
}

html body .panel.panel-info {
    border: 1px solid var(--th-line) !important;
    border-radius: var(--th-radius) !important;
    background: #fff;
    box-shadow: var(--th-shadow);
    overflow: hidden;
}

html body :is(table, th, td) {
    border-color: var(--th-line) !important;
}

html body thead {
    background: var(--th-bar-accent) !important;
    color: var(--th-primary-dark) !important;
}

html body thead th {
    color: var(--th-primary-dark) !important;
    font-weight: 700;
}

html body tbody td {
    background: #fff;
    color: var(--th-text);
}

html body tbody tr:nth-child(even) td {
    background: #f3fbf7;
}

/* Jodi / panel highlights keep their meaning (red), in the theme's hot colour —
   exactly the classes the chart pages colour red, nothing wider. */
html body :is(.r, .red, .chart-11, .chart-22, .chart-33, .chart-44, .chart-55, .chart-66, .chart-77, .chart-88, .chart-99, .chart-00, .chart-05, .chart-50, .chart-16, .chart-61, .chart-27, .chart-72, .chart-38, .chart-83, .chart-49, .chart-94, .chat-05, .chat-50, .chat-16, .chat-61, .chat-27, .chat-72, .chat-38, .chat-83, .chat-49, .chat-94, .css-11, .css-16, .css-22, .css-27, .css-33, .css-38, .css-44, .css-49, .css-50, .css-55, .css-61, .css-66, .css-72, .css-83, .css-88, .css-94, .css-99, .css-05, .css-00, .css-77, .css-star) {
    color: var(--th-hot) !important;
}

html body .chart-result {
    background: #fff !important;
    border: 1px solid var(--th-line) !important;
    border-radius: var(--th-radius) !important;
    box-shadow: var(--th-shadow) !important;
}

html body .chart-result div {
    color: var(--th-primary-dark) !important;
}

html body .chart-result span {
    color: var(--th-result) !important;
}

html body .chart-result a,
html body .button2 {
    background: var(--th-bar) !important;
    color: #fff !important;
    border: 1px solid var(--th-accent) !important;
    border-radius: 999px !important;
    box-shadow: 0 2px 8px rgba(6, 78, 59, .2) !important;
}

html body .chart-list {
    background: #fff;
    border: 1px solid var(--th-line) !important;
    border-radius: var(--th-radius) !important;
    box-shadow: var(--th-shadow);
    overflow: hidden;
}

html body .chart-list h4 {
    background: var(--th-bar) !important;
    color: #fff !important;
    border-radius: 0 !important;
}

html body .chart-list a {
    color: var(--th-primary-dark) !important;
    border-bottom: 1px solid var(--th-line) !important;
}

html body .chart-list a:hover {
    background: var(--th-accent-soft) !important;
}

html body footer {
    background: #fff !important;
    color: var(--th-primary) !important;
    border: 1px solid var(--th-line) !important;
    border-top: 4px solid var(--th-primary) !important;
    border-radius: var(--th-radius) !important;
    box-shadow: var(--th-shadow);
}

html body footer > div {
    border-bottom-color: var(--th-line) !important;
}

html body footer :is(.ftr-icon, p span, a) {
    color: var(--th-primary) !important;
}

/* ==========================================================================
   Guessing forum + guesser login / register
   ========================================================================== */
html body :is(.logo-div, .login-area, .forum-rules1, .forum-special-offer) {
    background: #fff !important;
    border: 1px solid var(--th-line) !important;
    border-radius: var(--th-radius) !important;
    box-shadow: var(--th-shadow);
}

html body [style*="border: 2px solid #eb008b"],
html body [style*="border:2px solid #eb008b"] {
    border: 1px solid var(--th-line) !important;
    border-radius: var(--th-radius) !important;
    background: #fff;
    box-shadow: var(--th-shadow);
}

html body :is(.login-area h4, .forum-rules1 h4, .panel-info .panel-heading, .headingBck) {
    background: var(--th-bar) !important;
    color: #fff !important;
    border-bottom: 3px solid var(--th-accent) !important;
    box-shadow: none !important;
}

html body .extra-feature h5 {
    color: var(--th-primary) !important;
}

html body :is(.login-area input, .login-area select, .login-area textarea, .form-control) {
    border: 1px solid var(--th-line-2) !important;
    border-radius: 10px !important;
    background: #fff !important;
    color: var(--th-text) !important;
    font-family: inherit !important;
}

html body :is(.login-area input, .login-area select, .login-area textarea, .form-control):focus {
    border-color: var(--th-primary) !important;
    box-shadow: 0 0 0 3px rgba(4, 120, 87, .12) !important;
    outline: 0 !important;
}

html body :is(.btn-mahi, .login-area button, .login-area .btn, .login-area a.btn-aa, .ex-feature, .extra-feature a,
    .btn-info, .btn-success, a[style*="#9c27b0"], a[style*="#2196f3"], a[style*="#e91e63"]) {
    background: var(--th-bar) !important;
    color: #fff !important;
    border: 1px solid var(--th-accent) !important;
    border-radius: 999px !important;
    box-shadow: 0 2px 8px rgba(6, 78, 59, .2) !important;
}

html body :is(.btn-mahi, .login-area button, .login-area .btn, .ex-feature, .extra-feature a):hover {
    background: var(--th-bar-accent) !important;
    color: var(--th-primary-dark) !important;
}

/* forum posts */
html body .my-card {
    background: #fff !important;
    border: 1px solid var(--th-line) !important;
    border-radius: var(--th-radius) !important;
    box-shadow: var(--th-shadow) !important;
}

html body .my-card .card-head {
    background: var(--th-bar) !important;
    border-bottom: 3px solid var(--th-accent) !important;
}

html body .my-card .card-head :is(a, h5) {
    color: #fff !important;
}

html body .my-card .card-body {
    background: linear-gradient(180deg, var(--th-accent-soft), #fff 70%);
    color: var(--th-text) !important;
}

html body .my-card .card-body p {
    color: var(--th-text) !important;
}

html body .card-footer {
    border-top: 1px solid var(--th-line) !important;
    background: #fff;
}

html body .card-footer .card-btn {
    background: #fff !important;
    color: var(--th-primary) !important;
    border-right: 1px solid var(--th-line) !important;
    font-weight: 600;
}

html body .card-footer .card-btn:hover {
    background: var(--th-accent-soft) !important;
}

html body .forum-post-footer1,
html body .forum-post-footer2,
html body .panel-success :is(.panel-footer, .panel-heading) {
    background: var(--th-accent-soft) !important;
}

html body .panel,
html body .panel-info,
html body .navbar-default {
    border-color: var(--th-line) !important;
}

/* bottom app-style nav */
html body .fixed-footer {
    box-shadow: 0 -4px 16px rgba(6, 78, 59, .25) !important;
}

html body .fixed-footer a {
    background: var(--th-bar) !important;
    border-left: 1px solid rgba(45, 212, 191, .35) !important;
    color: #fff !important;
}

html body .fixed-footer a:hover {
    background: var(--th-primary-dark) !important;
    color: var(--th-accent-2) !important;
}

/* ==========================================================================
   How-to-play / help-desk (template_u) nav and plain info pages
   ========================================================================== */
html body nav a {
    color: var(--th-primary) !important;
    font-weight: 600;
}

html body :is(h1, h2, h3) {
    font-weight: 700;
}

/* Forum: pink-bordered boxes that come from its own ".para1 p" / form styles
   (scoped away from the landing page's .para1 welcome text). */
html body :is(.para1 > div:not(.mrque-div) > p, .tab-pane > form.form) {
    background: #fff !important;
    border: 1px solid var(--th-line) !important;
    border-radius: var(--th-radius) !important;
    box-shadow: var(--th-shadow) !important;
}

/* ...except the text inside the "Duniya Ko Dikhao" pill link, which is part of the pill. */
html body .para1 > div > a > p {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    color: #fff !important;
}