/* Atomicmail/SMMMatrix custom global style patch
   Purpose:
   1) Remove box shadows globally.
   2) Make custom dashboard/social-media cards follow the active theme colors.
*/

*,
*::before,
*::after {
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    box-shadow: none !important;
}

:root {
    --am-custom-accent: var(--primary-color, var(--theme_color, var(--brand-color, var(--violet, #ff5b3f))));
    --am-custom-card-bg: var(--bg-color4, var(--background-color-alt, var(--darkblue2, #f5f7ff)));
    --am-custom-item-bg: var(--bg-color1, var(--background-color, var(--darkblue3, #ffffff)));
    --am-custom-heading: var(--heading-color, var(--heading_color, var(--title-color, var(--white, #001f3f))));
    --am-custom-text: var(--body-color, var(--body_color, var(--text-color, var(--smokeWhite, #1a1a1a))));
    --am-custom-border: var(--border-color1, var(--border1, var(--border-color, rgba(140, 152, 164, .25))));
}

.dark-theme,
.dark-mode,
body.dark-theme,
body.dark-mode {
    --am-custom-card-bg: var(--bg-color3, var(--darkblue2, #161243));
    --am-custom-item-bg: var(--bg-color2, var(--darkblue3, #211f46));
    --am-custom-heading: var(--heading-color, var(--white, #ffffff));
    --am-custom-text: var(--body-color, var(--smokeWhite, #d1cbdb));
    --am-custom-border: var(--border-color1, rgba(255, 255, 255, .12));
}

/* Social media section added to the user dashboard */
.social-media-dashboard-card,
.dashboard-social-media-card {
    border: 1px solid var(--am-custom-border) !important;
    border-radius: 8px !important;
    background: var(--am-custom-card-bg) !important;
    color: var(--am-custom-text) !important;
}

.social-media-dashboard-card .card-body,
.dashboard-social-media-card .card-body {
    background: transparent !important;
}

.dashboard-social-media-item,
.social-media-dashboard-card a.dashboard-social-media-item {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
    min-height: 54px !important;
    padding: 14px 18px !important;
    border: 1px solid var(--am-custom-accent) !important;
    border-radius: 8px !important;
    background: var(--am-custom-item-bg) !important;
    color: var(--am-custom-heading) !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: color .2s ease, border-color .2s ease, background-color .2s ease !important;
    transform: none !important;
}

.dashboard-social-media-item:hover,
.social-media-dashboard-card a.dashboard-social-media-item:hover {
    color: var(--am-custom-accent) !important;
    border-color: var(--am-custom-accent) !important;
    background: var(--am-custom-item-bg) !important;
    transform: none !important;
}

.dashboard-social-media-icon img {
    width: 18px !important;
    height: 18px !important;
    object-fit: contain !important;
    display: block !important;
}

.dashboard-social-media-name {
    line-height: 1.2 !important;
    text-transform: uppercase !important;
    color: inherit !important;
}

/* General custom cards/boxes should use theme background, not a hardcoded white. */
.card,
.custom-card,
.modal-content,
.dropdown-menu,
.box-card,
.search-bar,
.table-responsive,
.form-control,
.form-select {
    box-shadow: none !important;
}