/* =========================================================
   Haris SEO Tools - Modern aMember Theme CSS v3
   ========================================================= */

/* -----------------------------
   Global Theme Variables
----------------------------- */

:root {
    --hst-primary: #2563eb;
    --hst-primary-hover: #1d4ed8;
    --hst-primary-dark: #1e40af;

    --hst-text-dark: #0f172a;
    --hst-text-medium: #334155;
    --hst-text-light: #64748b;

    --hst-border: #e2e8f0;
    --hst-border-dark: #cbd5e1;

    --hst-background: #f8fafc;
    --hst-card-background: #ffffff;

    --hst-success: #10b981;
    --hst-success-background: #ecfdf5;

    --hst-radius-small: 10px;
    --hst-radius-medium: 12px;
    --hst-radius-large: 16px;

    --hst-shadow-small: 0 2px 4px rgb(15 23 42 / 0.04);
    --hst-shadow-card: 0 4px 6px -1px rgb(15 23 42 / 0.05);
    --hst-shadow-hover: 0 12px 28px rgb(15 23 42 / 0.08);
}


/* =========================================================
   Main Member Page
   ========================================================= */

body.am-page-main {
    background: var(--hst-background) !important;
}

body.am-page-main .am-body-content-wrapper {
    width: 100% !important;
    max-width: 1280px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.am-page-main .am-body-content {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}


/* =========================================================
   Hide Default aMember Header Elements
   ========================================================= */

/*
   Username, user icon and logout area:
   warisfarooq989 Logout
*/

body.am-page-main .am-user-identity-block,
body.am-page-main .am-user-identity,
body.am-page-main .am-user-info,
body.am-page-main .am-user-login,
body.am-page-main .am-login-information {
    display: none !important;
}


/*
   Default aMember navigation:
   Signup Form, Customer Profile, Helpdesk
*/

body.am-page-main .am-user-menu,
body.am-page-main .am-user-menu-wrapper,
body.am-page-main .am-tabs,
body.am-page-main .am-tabs-wrapper,
body.am-page-main .am-navigation,
body.am-page-main .am-member-menu {
    display: none !important;
}


/*
   Remove the empty area left by the default menu
*/

body.am-page-main .am-body-content-top,
body.am-page-main .am-layout-two-coll-top,
body.am-page-main .am-layout-two-coll-bottom {
    display: none !important;
}


/*
   Hide default Dashboard page heading.
   The custom "Welcome back" heading will remain visible
   because it is inside the custom dashboard container.
*/

body.am-page-main .am-body-content > h1:first-child,
body.am-page-main .am-body-content > .am-page-title,
body.am-page-main .am-body-content > .am-body-content-title,
body.am-page-main .am-page-title,
body.am-page-main .am-breadcrumbs {
    display: none !important;
}


/* =========================================================
   Remove Old aMember Layout Styling
   ========================================================= */

body.am-page-main .am-layout-two-coll {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.am-page-main .am-coll-left,
body.am-page-main .am-coll-right {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.am-page-main .am-coll-content {
    padding: 0 !important;
    margin: 0 !important;
}


/* =========================================================
   Default aMember Widgets
   ========================================================= */

body.am-page-main .am-widget {
    margin: 0 0 20px !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.am-page-main .am-widget > h2 {
    margin: 0 0 14px !important;
    padding: 0 !important;
    color: var(--hst-text-dark) !important;
    font-size: 18px !important;
    line-height: 1.4 !important;
    font-weight: 700 !important;
    background: transparent !important;
    border: 0 !important;
}


/* =========================================================
   Big Clean Cards
   ========================================================= */

body.am-page-main .am-widget .am-block,
body.am-page-main div[style*="Active Resources"],
body.am-page-main div[style*="Your Membership"],
body.am-page-main div[style*="E-Mail Preferences"] {
    margin: 0 0 24px !important;
    padding: 24px !important;

    background: var(--hst-card-background) !important;
    border: 1px solid var(--hst-border) !important;
    border-radius: var(--hst-radius-large) !important;

    box-shadow: var(--hst-shadow-card) !important;
}


/* =========================================================
   Subscription Items
   ========================================================= */

body.am-page-main .am-subscription,
body.am-page-main .am-active-subscription,
body.am-page-main div[style*="Moz Pro"],
body.am-page-main div[style*="Semrush"] {
    margin: 0 0 12px !important;
    padding: 16px 18px !important;

    background: var(--hst-card-background) !important;
    border: 1px solid var(--hst-border) !important;
    border-radius: var(--hst-radius-medium) !important;

    box-shadow: var(--hst-shadow-small) !important;
}


/* =========================================================
   Default Block Titles
   ========================================================= */

body.am-page-main .am-block h2,
body.am-page-main .am-block h3,
body.am-page-main .am-block .am-title {
    margin: 0 0 10px !important;
    padding: 0 !important;

    color: var(--hst-text-dark) !important;
    font-size: 17px !important;
    line-height: 1.4 !important;
    font-weight: 700 !important;

    background: transparent !important;
    border: 0 !important;
}


/* =========================================================
   Useful Links
   ========================================================= */

body.am-page-main .am-useful-links {
    margin-bottom: 24px !important;
    padding: 12px 8px !important;

    background: var(--hst-card-background) !important;
    border: 1px solid var(--hst-border) !important;
    border-radius: var(--hst-radius-large) !important;

    box-shadow: var(--hst-shadow-small) !important;
}

body.am-page-main .am-useful-links ul {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

body.am-page-main .am-useful-links li {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

body.am-page-main .am-useful-links a {
    display: flex !important;
    align-items: center !important;

    width: 100% !important;
    margin: 0 !important;
    padding: 10px 16px !important;

    background: transparent !important;
    color: var(--hst-text-medium) !important;

    border: 0 !important;
    border-radius: var(--hst-radius-small) !important;

    font-size: 14px !important;
    font-weight: 500 !important;
    text-decoration: none !important;

    transform: none !important;
    transition: background 0.2s ease, color 0.2s ease !important;
}

body.am-page-main .am-useful-links a:hover {
    background: #f1f5f9 !important;
    color: var(--hst-primary) !important;
    transform: none !important;
}


/* =========================================================
   Modern Buttons
   ========================================================= */

/*
   Buttons are scoped inside aMember content.
   This prevents the custom Haris SEO Tools header
   and navigation from being affected.
*/

body.am-page-main .am-body-content .am-btn,
body.am-page-main .am-body-content a.am-btn,
body.am-page-main .am-body-content button,
body.am-page-main .am-body-content input[type="submit"],
body.am-page-main .am-body-content input[type="button"] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-height: 42px !important;
    padding: 9px 18px !important;

    background: var(--hst-primary) !important;
    color: #ffffff !important;

    border: 1px solid var(--hst-primary) !important;
    border-radius: var(--hst-radius-medium) !important;

    font-size: 14px !important;
    line-height: 1.4 !important;
    font-weight: 600 !important;
    text-decoration: none !important;

    cursor: pointer !important;

    transition:
        background 0.2s ease,
        border-color 0.2s ease,
        transform 0.2s ease,
        box-shadow 0.2s ease !important;
}

body.am-page-main .am-body-content .am-btn:hover,
body.am-page-main .am-body-content a.am-btn:hover,
body.am-page-main .am-body-content button:hover,
body.am-page-main .am-body-content input[type="submit"]:hover,
body.am-page-main .am-body-content input[type="button"]:hover {
    background: var(--hst-primary-hover) !important;
    border-color: var(--hst-primary-hover) !important;
    color: #ffffff !important;

    transform: translateY(-1px) !important;
    box-shadow: 0 6px 14px rgb(37 99 235 / 0.18) !important;
}

body.am-page-main .am-body-content .am-btn:active,
body.am-page-main .am-body-content button:active,
body.am-page-main .am-body-content input[type="submit"]:active {
    transform: translateY(0) !important;
}


/* =========================================================
   Resource and Widget Action Links
   ========================================================= */

body.am-page-main .am-widget .am-block a:not(.am-useful-links a) {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    margin-top: 10px;
    padding: 8px 18px;

    background: var(--hst-primary);
    color: #ffffff;

    border-radius: var(--hst-radius-small);

    font-size: 14px;
    line-height: 1.4;
    font-weight: 600;
    text-decoration: none;

    transition:
        background 0.2s ease,
        transform 0.2s ease;
}

body.am-page-main .am-widget .am-block a:not(.am-useful-links a):hover {
    background: var(--hst-primary-dark);
    color: #ffffff;
    text-decoration: none;

    transform: translateY(-1px);
}


/* =========================================================
   Forms
   ========================================================= */

body.am-page-main .am-form input[type="text"],
body.am-page-main .am-form input[type="email"],
body.am-page-main .am-form input[type="password"],
body.am-page-main .am-form input[type="number"],
body.am-page-main .am-form input[type="tel"],
body.am-page-main .am-form input[type="url"],
body.am-page-main .am-form input[type="date"],
body.am-page-main .am-form select,
body.am-page-main .am-form textarea {
    width: 100%;

    padding: 10px 12px !important;

    background: #ffffff !important;
    color: var(--hst-text-dark) !important;

    border: 1px solid var(--hst-border-dark) !important;
    border-radius: var(--hst-radius-small) !important;

    outline: none !important;
    box-shadow: none !important;

    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease !important;
}

body.am-page-main .am-form input:focus,
body.am-page-main .am-form select:focus,
body.am-page-main .am-form textarea:focus {
    border-color: var(--hst-primary) !important;
    box-shadow: 0 0 0 3px rgb(37 99 235 / 0.12) !important;
}


/* =========================================================
   Tables
   ========================================================= */

body.am-page-main .am-grid,
body.am-page-main table {
    width: 100% !important;
    overflow: hidden !important;

    background: #ffffff !important;
    border: 1px solid var(--hst-border) !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    border-radius: var(--hst-radius-medium) !important;
}

body.am-page-main .am-grid th,
body.am-page-main table th {
    padding: 12px 14px !important;

    background: #f8fafc !important;
    color: var(--hst-text-medium) !important;

    border-bottom: 1px solid var(--hst-border) !important;

    font-size: 13px !important;
    font-weight: 700 !important;
    text-align: left !important;
}

body.am-page-main .am-grid td,
body.am-page-main table td {
    padding: 12px 14px !important;

    color: var(--hst-text-medium) !important;
    border-bottom: 1px solid var(--hst-border) !important;

    font-size: 14px !important;
}

body.am-page-main .am-grid tr:last-child td,
body.am-page-main table tr:last-child td {
    border-bottom: 0 !important;
}


/* =========================================================
   Messages and Alerts
   ========================================================= */

body.am-page-main .am-info,
body.am-page-main .am-message,
body.am-page-main .am-success,
body.am-page-main .am-error {
    margin: 0 0 20px !important;
    padding: 14px 16px !important;

    border-radius: var(--hst-radius-medium) !important;

    font-size: 14px !important;
    line-height: 1.6 !important;
}

body.am-page-main .am-success {
    background: var(--hst-success-background) !important;
    color: #047857 !important;
    border: 1px solid #a7f3d0 !important;
}

body.am-page-main .am-error {
    background: #fef2f2 !important;
    color: #b91c1c !important;
    border: 1px solid #fecaca !important;
}

body.am-page-main .am-info,
body.am-page-main .am-message {
    background: #eff6ff !important;
    color: #1d4ed8 !important;
    border: 1px solid #bfdbfe !important;
}


/* =========================================================
   Custom Haris Dashboard Compatibility
   ========================================================= */

body.am-page-main .wr-dashboard {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
}

body.am-page-main .wr-dashboard h1,
body.am-page-main .wr-dashboard h2,
body.am-page-main .wr-dashboard h3 {
    color: var(--hst-text-dark) !important;
}

body.am-page-main .wr-dashboard a {
    text-decoration: none;
}


/*
   Do not apply default aMember block button styles
   to the custom dashboard cards.
*/

body.am-page-main .wr-dashboard .wr-access-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;
    margin-top: 0 !important;
    padding: 10px 16px !important;

    background: var(--hst-primary) !important;
    color: #ffffff !important;

    border-radius: var(--hst-radius-medium) !important;

    font-size: 14px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}

body.am-page-main .wr-dashboard .wr-access-button:hover {
    background: var(--hst-primary-hover) !important;
    color: #ffffff !important;
}


/* =========================================================
   Hide Duplicate Default Dynamic Widgets
   ========================================================= */

/*
   These resources and subscriptions are already rendered
   in the custom dashboard design.
*/

body.am-page-main #widget-member-main-subscriptions,
body.am-page-main #widget-member-main-resources {
    display: none !important;
}


/* Additional possible aMember widget IDs */

body.am-page-main #widget-member-main-active-subscriptions,
body.am-page-main #widget-member-main-active-resources {
    display: none !important;
}


/* =========================================================
   Remove Unwanted Empty Elements
   ========================================================= */

body.am-page-main .am-body-content-top:empty,
body.am-page-main .am-body-content-bottom:empty,
body.am-page-main .am-coll-content:empty,
body.am-page-main .am-block:empty,
body.am-page-main .am-widget:empty {
    display: none !important;
}


/* =========================================================
   Mobile and Tablet Responsive Design
   ========================================================= */

@media screen and (max-width: 980px) {
    body.am-page-main .am-body-content-wrapper {
        max-width: 100% !important;
    }

    body.am-page-main .am-layout-two-coll {
        display: block !important;
    }

    body.am-page-main .am-coll-left,
    body.am-page-main .am-coll-right {
        width: 100% !important;
        float: none !important;
    }
}

@media screen and (max-width: 700px) {
    body.am-page-main .am-body-content-wrapper {
        padding: 0 !important;
    }

    body.am-page-main .am-widget .am-block,
    body.am-page-main div[style*="Active Resources"],
    body.am-page-main div[style*="Your Membership"],
    body.am-page-main div[style*="E-Mail Preferences"] {
        padding: 18px !important;
        border-radius: 14px !important;
    }

    body.am-page-main .am-subscription,
    body.am-page-main .am-active-subscription {
        padding: 14px 15px !important;
    }

    body.am-page-main .am-grid,
    body.am-page-main table {
        display: block !important;
        overflow-x: auto !important;
        white-space: nowrap !important;
    }

    body.am-page-main .am-form input,
    body.am-page-main .am-form select,
    body.am-page-main .am-form textarea {
        font-size: 16px !important;
    }
}


/* =========================================================
   Final Safety Overrides
   ========================================================= */

/*
   Hide default menu even when aMember adds inline styling.
*/

body.am-page-main .am-user-identity-block[style],
body.am-page-main .am-user-menu[style],
body.am-page-main .am-tabs[style],
body.am-page-main .am-tabs-wrapper[style] {
    display: none !important;
}


/*
   Remove separators belonging to the old menu.
*/

body.am-page-main .am-user-identity-block + hr,
body.am-page-main .am-user-menu + hr,
body.am-page-main .am-tabs + hr {
    display: none !important;
}