/* ===========================
   PAGE WIDTH
   =========================== */
body,
.mLayout,
#mLayout,
.mBody {
  max-width: 1200px !important; /* or 100% if you prefer full width */
  width: 100% !important;
  margin: 0 auto !important;
  padding: 0 20px;
  box-sizing: border-box;
}

/* Remove unwanted container width limits */
.WaGadget,
.WaContainer,
.WaContent,
.gadgetStyleNone,
.row,
.col {
  max-width: 100% !important;
  width: 100% !important;
  box-sizing: border-box;
}

/* Optional page-specific width */
#id_YourPageId,
.custom-width-box {
  width: 100% !important;
}

/* ===========================
   BUTTON COLORS
   =========================== */
.navigationOuterContainer .navigationContainer input.nextButton,
.navigationOuterContainer .navigationContainer input.typeButton,
.navigationOuterContainer .navigationContainer input[type=submit],
.loginButton,
.typeButton,
input[type=submit] {
  background-color: #1c4777 !important;
  color: #ffffff !important;
}

.navigationOuterContainer .navigationContainer input.nextButton:hover,
.navigationOuterContainer .navigationContainer input.typeButton:hover,
.navigationOuterContainer .navigationContainer input[type=submit]:hover,
.loginButton:hover,
.typeButton:hover,
input[type=submit]:hover {
  background-color: #1c4777 !important;
}
/* ===========================
   GLOBAL SITE BACKGROUND
   =========================== */
body, 
.mBody, 
.layoutMain, 
.zoneContent {
    background-color: #f7f9fb !important;
}

/* Ensure the white cards still pop */
.nafic-card, 
.WaGadget {
    background-color: #ffffff; /* keeps gadget backgrounds white */
}


/* 2. Remove white background from the specific gadget holding the logo */
/* This targets Content gadgets inside the header */
.zoneHeader1 .WaGadgetContent, 
.zoneHeader2 .WaGadgetContent {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* 3. (Optional) If the logo is inside a layout column with a color */
.zoneHeader1 .WaLayoutContainerFirst, 
.zoneHeader1 .WaLayoutContainer {
    background-color: transparent !important;
}
/* ===========================
   LOGIN / LOGOUT BUTTONS
   =========================== */
.WaGadgetLoginButton .loginLink,
.WaGadgetLoginForm .loginLink {
  background: #e5ecf1d3 !important;
  color: white !important;
}

.WaGadgetLoginButton .loginLink:hover,
.WaGadgetLoginForm .loginLink:hover {
  background: #2f3a3d !important;
}

/* Logout (authenticated) */
.WaGadgetLoginButton .authenticated .loginLink,
.WaGadgetLoginForm .authenticated .loginLink {
  background: 0 !important;
  color: #2f3a3d !important;
}

.WaGadgetLoginButton .authenticated .loginLink:hover,
.WaGadgetLoginButton .authenticated .loginLink.hover,
.WaGadgetLoginForm .authenticated .loginLink:hover,
.WaGadgetLoginForm .authenticated .loginLink.hover {
  background: #2f3a3d !important;
  color: white !important;
}
/* ===========================
   Replace Author Name
   =========================== */

/* Hide original author text */
.WaGadgetBlog .postedBy,
.WaGadgetBlog .author,
.WaGadgetBlog .postedByLink,
.WaGadgetBlog .authorName {
    font-size: 0 !important; /* hides the original text */
}

/* Insert custom text in blog posts */
.WaGadgetBlog .postedBy:after,
.WaGadgetBlog .author:after,
.WaGadgetBlog .postedByLink:after,
.WaGadgetBlog .authorName:after {
    content: "Posted by NAFIC Home Office";
    font-size: 12px !important;
    color: #333;            /* adjust color if needed */
    font-style: italic;     /* optional — remove if you want normal text */
}

/* Recent Blog Posts gadget (sidebar or list) */
.WaGadgetRecentBlogPosts .author,
.WaGadgetRecentBlogPosts .postedByLink {
    font-size: 0 !important;
}

.WaGadgetRecentBlogPosts .author:after,
.WaGadgetRecentBlogPosts .postedByLink:after {
    content: "Posted by NAFIC Home Office";
    font-size: 11px !important;
    color: #333;
    font-style: italic;
}
/* ===========================
   IMAGE CLEANUP
   =========================== */
.wa-gadget-image img,
.kaleidoscope-photo img {
  background-color: white !important;
  object-fit: cover !important;
}

img {
  background-color: white !important;
  object-fit: cover;
}

img[style*="border"] {
  border: none !important;
}

img,
.gadgetImage img,
.photo,
.photo img {
  background: white !important;
  box-shadow: none !important;
}
/* ===========================
   NAFIC CARD (System Page Safe)
   =========================== */
.nafic-card {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    padding: 24px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
    font-family: Inter, system-ui, -apple-system, 'Helvetica Neue', Arial, sans-serif;
    box-sizing: border-box;
    
    /* CHANGED: This prevents the "Cutting Off" issue */
    overflow: visible !important; 
}

/* MOBILE ADJUSTMENTS */
@media only screen and (max-width: 600px) {
    .nafic-card {
        padding: 15px !important;
        border-radius: 10px;
        
        /* Ensures really wide tables can scroll sideways instead of breaking layout */
        overflow-x: auto !important; 
    }
    
    /* Board Member Stack Fix */
    .WaGadgetFeaturedMember .layoutHorizontal li {
        flex-direction: column !important;
        align-items: flex-start !important;
        text-align: left !important;
        gap: 15px !important;
    }
    
    .WaGadgetFeaturedMember .img {
        margin-bottom: 5px !important;
    }
}

/* ===========================
   FEATURED MEMBER (BOARD) CLEANUP - V2
   =========================== */

/* 1. Reset the Gadget Container */
.WaGadgetFeaturedMember {
    height: 100%;
}

/* 2. Style the Header */
.WaGadgetFeaturedMember h4.gadgetTitleH4 {
    font-family: Inter, system-ui, sans-serif !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    color: #94a3b8 !important;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 20px !important;
    border-bottom: 1px solid #e5e7eb;
    padding-bottom: 10px;
}

/* 3. Layout the Content - SPACED OUT & NARROWER */
.WaGadgetFeaturedMember .gadgetStyleBody {
    /* This makes the list narrower and centered */
    max-width: 85% !important; 
    margin: 0 auto !important; 
}

.WaGadgetFeaturedMember .layoutHorizontal li {
    display: flex !important;
    align-items: center;
    gap: 30px; /* Increased gap between Photo and Name */
    width: 100% !important;
    
    /* Adds vertical spacing between members */
    margin-bottom: 25px !important; 
    padding-bottom: 25px !important;
    border-bottom: 1px solid #f8fafc; /* Subtle separator line */
    list-style: none !important;
}

/* Remove spacing from the very last person so they fit the card */
.WaGadgetFeaturedMember .layoutHorizontal li:last-child {
    border-bottom: none !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

/* 4. Fix the Image */
.WaGadgetFeaturedMember .img {
    flex: 0 0 auto;
    margin: 0 !important;
    padding: 0 !important;
}

.WaGadgetFeaturedMember .img img {
    width: 90px !important;  /* Slightly larger for better visibility */
    height: 90px !important;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid #f1f5f9;
    box-shadow: 0 4px 6px rgba(0,0,0,0.05); /* Adds a tiny pop to the photo */
}

/* 5. Fix the Name and Titles */
.WaGadgetFeaturedMember .rightPart {
    text-align: left !important;
    float: none !important;
    width: auto !important;
    padding: 0 !important;
}

.WaGadgetFeaturedMember .label_1 a {
    font-family: Inter, system-ui, sans-serif !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #0b62a3 !important;
    text-decoration: none !important;
}

.WaGadgetFeaturedMember .subtitle {
    font-family: Inter, system-ui, sans-serif !important;
    font-size: 14px !important;
    color: #111 !important;
    font-weight: 600 !important;
    margin-top: 4px;
}

.WaGadgetFeaturedMember .description {
    font-family: Inter, system-ui, sans-serif !important;
    font-size: 13px !important;
    color: #64748b !important;
    margin-top: 4px; /* Added breathing room */
}
/* ===========================
   TIGHTEN MENU SPACING
   =========================== */

/* 1. Reduce space between standard menu links */
.WaGadgetMenuHorizontal .menuInner ul.firstLevel > li > .item > a {
    padding-left: 8px !important;  /* Was likely 15px+ */
    padding-right: 8px !important; /* Was likely 15px+ */
    font-size: 13px !important;    /* Slight reduction if needed (optional) */
}

/* 2. Reduce the gap before the Member Access button */
.WaGadgetMenuHorizontal .menuInner ul.firstLevel > li:last-child > .item > a {
    margin-left: 10px !important; /* Reduced from 20px */
}

/* ===========================
   LEFT ALIGN MENU ITEMS
   =========================== */
.WaGadgetMenuHorizontal .menuInner {
    text-align: left !important;
    justify-content: flex-start !important;
}

/* Push the Blue Button to the far Right */
.WaGadgetMenuHorizontal .menuInner ul.firstLevel {
    width: 100% !important;
    display: flex !important;
}

.WaGadgetMenuHorizontal .menuInner ul.firstLevel > li:last-child {
    margin-left: auto !important; /* This is the magic rule that pushes the button right */
    padding-right: 0 !important;
}
/* ===========================
   MENU BUTTON STYLE
   =========================== */

/* 1. Turn the last menu item into a blue button */
.WaGadgetMenuHorizontal .menuInner ul.firstLevel > li:last-child > .item > a {
    background-color: #0b62a3 !important; /* Brand Blue */
    color: #ffffff !important;            /* White Text */
    border: 1px solid #0b62a3 !important;
    padding: 10px 20px !important;        /* Button Size */
    border-radius: 6px !important;        /* Rounded Corners */
    font-weight: 700 !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    margin-left: 20px !important;         /* Pushes it away from other links */
    transition: all 0.3s ease !important;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

/* 2. Hover Effect (Darker Blue) */
.WaGadgetMenuHorizontal .menuInner ul.firstLevel > li:last-child > .item > a:hover {
    background-color: #084d82 !important;
    border-color: #084d82 !important;
    color: #ffffff !important;
    transform: translateY(-1px);
}

/* 3. Vertically Center it */
.WaGadgetMenuHorizontal .menuInner ul.firstLevel > li:last-child {
    display: flex !important;
    align-items: center !important;
}

/* ===========================
   FORCE FIT CENTERED MENU
   =========================== */
.WaGadgetMenuHorizontal .menuInner ul.firstLevel > li > .item > a {
    padding-left: 5px !important;  /* Very tight padding */
    padding-right: 5px !important;
    font-size: 12px !important;    /* Smaller font to make room */
    letter-spacing: -0.2px !important; /* Squeeze letters slightly */
}

/* Ensure Button still has room */
.WaGadgetMenuHorizontal .menuInner ul.firstLevel > li:last-child > .item > a {
    margin-left: 5px !important;
    font-size: 12px !important;
    padding: 8px 12px !important; /* Slightly smaller button */
}
/* ===========================
   NUCLEAR HEADER TRANSPARENCY
   =========================== */

/* 1. Target the specific Top Header Zone and EVERYTHING inside it */
.zoneHeader1, 
.zoneHeader1 .WaPlaceHolder, 
.zoneHeader1 .WaLayoutContainerFirst, 
.zoneHeader1 .WaLayoutContainer, 
.zoneHeader1 .WaLayoutItem, 
.zoneHeader1 .WaGadget, 
.zoneHeader1 .gadgetStyleBody,
.zoneHeader1 table,
.zoneHeader1 td {
    background-color: transparent !important;
    background: none !important;
    box-shadow: none !important;
    border: none !important;
}

/* 2. Double-check the image itself hasn't been given a background */
.zoneHeader1 img {
    background-color: transparent !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
}

/* ===========================
   MENU DROPDOWN STYLING
   =========================== */

/* 1. Style the Dropdown Container (The Box) */
.WaGadgetMenuHorizontal .menuInner ul.secondLevel {
    background-color: #ffffff !important;  /* Solid White Background */
    border: 1px solid #e5e7eb !important;  /* The Grey Border */
    border-radius: 8px !important;         /* Rounded Corners */
    box-shadow: 0 4px 15px rgba(0,0,0,0.1) !important; /* Nice Drop Shadow */
    padding: 8px 0 !important;             /* Spacing inside the box */
    margin-top: 5px !important;            /* Small gap from the main bar */
}

/* 2. Style the Links Inside */
.WaGadgetMenuHorizontal .menuInner ul.secondLevel > li > .item > a {
    color: #333333 !important;             /* Dark Grey Text */
    font-size: 14px !important;            /* Readable size */
    font-weight: 500 !important;
    padding: 10px 20px !important;         /* Space around the text */
    border-bottom: 1px solid #f1f5f9 !important; /* Very faint separator line */
    transition: all 0.2s ease;
}

/* 3. Remove separator from the very last item */
.WaGadgetMenuHorizontal .menuInner ul.secondLevel > li:last-child > .item > a {
    border-bottom: none !important;
}

/* 4. Hover Effect (Blue Background) */
.WaGadgetMenuHorizontal .menuInner ul.secondLevel > li > .item > a:hover {
    background-color: #f0f7ff !important;  /* Very Light Blue Hover */
    color: #0b62a3 !important;             /* Brand Blue Text */
    padding-left: 25px !important;         /* Slight "nudge" to the right on hover */
}

/* ===========================
   MEMBERSHIP APPLICATION STYLING
   =========================== */

/* 1. Hide the default messy headers */
.WaGadgetMembershipApplication .formTitle,
.WaGadgetMembershipApplication .mandatoryFieldsTitle {
    display: none !important;
}

/* 2. Style the Membership Level "Cards" */
.WaGadgetMembershipApplication .fieldItem {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 20px;
    margin-bottom: 20px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
    cursor: pointer;
}

/* Hover Effect */
.WaGadgetMembershipApplication .fieldItem:hover {
    border-color: #0b62a3;
    box-shadow: 0 4px 12px rgba(11, 98, 163, 0.15);
    transform: translateY(-2px);
}

/* 3. Style the Radio Button Area */
.WaGadgetMembershipApplication .typeRadioContainer {
    vertical-align: top;
    padding-top: 5px;
}

/* 4. Typography Styling inside the cards */
.WaGadgetMembershipApplication .labelTitle {
    font-size: 18px !important;
    color: #0b62a3 !important;
    font-weight: 800 !important;
    display: block;
    margin-bottom: 5px;
}

.WaGadgetMembershipApplication .levelPrice {
    font-size: 16px !important;
    color: #334155 !important;
    font-weight: 600 !important;
}

.WaGadgetMembershipApplication .levelDescription {
    display: block;
    margin-top: 15px;
    padding-top: 15px;
    border-top: 1px dashed #e2e8f0;
    font-size: 14px !important;
    color: #475569 !important;
    line-height: 1.6 !important;
}

/* 5. Style the "Next" Button */
.WaGadgetMembershipApplication input[type="submit"] {
    background-color: #0b62a3 !important;
    color: white !important;
    border: none !important;
    padding: 12px 40px !important;
    border-radius: 8px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    margin-top: 20px;
    width: 100%;
    max-width: 300px;
}

.WaGadgetMembershipApplication input[type="submit"]:hover {
    background-color: #084d82 !important;
}

/* ===========================
   MEMBER DIRECTORY HOVER FIX (PAGE 7746 ONLY)
   =========================== */

/* Default text color inside directory */
#PAGEID_7746 .WaGadgetMemberDirectory,
#PAGEID_7746 .WaGadgetMemberDirectory .memberDirectoryItem,
#PAGEID_7746 .WaGadgetMemberDirectory .memberDirectoryItem * {
  color: #1f2937 !important;
  -webkit-text-fill-color: #1f2937 !important;
}

/* Hover row stays light gray, text stays dark */
#PAGEID_7746 .WaGadgetMemberDirectory .memberDirectoryItem:hover,
#PAGEID_7746 .WaGadgetMemberDirectory .memberDirectoryItemHover,
#PAGEID_7746 .WaGadgetMemberDirectory .membersTable tr:hover,
#PAGEID_7746 .WaGadgetMemberDirectory .membersTable tr.hover {
  background-color: #eef2f6 !important;
  color: #1f2937 !important;
}

#PAGEID_7746 .WaGadgetMemberDirectory .memberDirectoryItem:hover *,
#PAGEID_7746 .WaGadgetMemberDirectory .memberDirectoryItemHover *,
#PAGEID_7746 .WaGadgetMemberDirectory .membersTable tr:hover *,
#PAGEID_7746 .WaGadgetMemberDirectory .membersTable tr.hover * {
  color: #1f2937 !important;
  -webkit-text-fill-color: #1f2937 !important;
  opacity: 1 !important;
}

/* Keep links visible and blue */
#PAGEID_7746 .WaGadgetMemberDirectory a,
#PAGEID_7746 .WaGadgetMemberDirectory a:visited,
#PAGEID_7746 .WaGadgetMemberDirectory a:hover,
#PAGEID_7746 .WaGadgetMemberDirectory a:focus {
  color: #0b62a3 !important;
  -webkit-text-fill-color: #0b62a3 !important;
}

/* "View details" specifically */
#PAGEID_7746 .WaGadgetMemberDirectory .viewDetails,
#PAGEID_7746 .WaGadgetMemberDirectory .viewDetails:hover,
#PAGEID_7746 .WaGadgetMemberDirectory .viewDetails:focus {
  color: #0b62a3 !important;
  text-decoration: underline !important;
}
/* NAFIC Membership Renewal Page */
#PAGEID_18012 {
  background:#f4f8fb;
  color:#0f172a;
}

/* Main renewal area */
#PAGEID_18012 .zoneHeader2 {
  background:linear-gradient(180deg,#f8fbff 0%,#eef6fb 100%) !important;
  padding:28px 16px 42px;
}

#PAGEID_18012 .zoneHeader2 > .WaPlaceHolder {
  max-width:980px;
  margin:0 auto;
  background:transparent !important;
}

/* Page title */
#PAGEID_18012 h2 {
  max-width:900px;
  margin:0 auto 18px !important;
  padding:0;
  color:#111827;
  font-size:34px;
  line-height:1.15;
  font-weight:800;
  letter-spacing:-.02em;
}

#PAGEID_18012 h2:after {
  content:"Review your profile information, confirm your mailing address, and continue to renew your NAFIC membership.";
  display:block;
  max-width:680px;
  margin-top:10px;
  color:#475569;
  font-size:16px;
  line-height:1.6;
  font-weight:400;
  letter-spacing:0;
}

/* Card wrapper */
#PAGEID_18012 .nafic-card,
#PAGEID_18012 .WaGadgetMembershipRenewal {
  max-width:900px;
  margin:0 auto 20px !important;
  background:#ffffff !important;
  border:1px solid #dbe5ef !important;
  border-radius:18px !important;
  box-shadow:0 12px 30px rgba(11,98,163,.08) !important;
  overflow:hidden;
}

/* Remove old Wild Apricot nested frame look */
#PAGEID_18012 .cornersContainer,
#PAGEID_18012 .c1,
#PAGEID_18012 .c2,
#PAGEID_18012 .c3,
#PAGEID_18012 .c4,
#PAGEID_18012 .c5,
#PAGEID_18012 .r1,
#PAGEID_18012 .r2,
#PAGEID_18012 .r3,
#PAGEID_18012 .r4,
#PAGEID_18012 .r5,
#PAGEID_18012 .d1,
#PAGEID_18012 .d2,
#PAGEID_18012 .d3,
#PAGEID_18012 .d4,
#PAGEID_18012 .d5,
#PAGEID_18012 .d6,
#PAGEID_18012 .d7,
#PAGEID_18012 .d8,
#PAGEID_18012 .d9 {
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

/* Renewal summary box */
#PAGEID_18012 .infoOuterContainer {
  margin:0 !important;
  padding:0 !important;
  background:#ffffff !important;
}

#PAGEID_18012 .infoContainer .inner {
  background:#f0f9ff !important;
  border:1px solid #bae6fd !important;
  border-radius:14px !important;
  padding:20px 22px !important;
  margin:22px !important;
}

#PAGEID_18012 .infoTitle {
  color:#0b62a3 !important;
  font-size:12px !important;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:800 !important;
}

#PAGEID_18012 .infoText {
  color:#0f172a !important;
  font-size:15px !important;
  font-weight:600;
}

#PAGEID_18012 .levelPrice {
  color:#0b62a3 !important;
  font-weight:800;
}

/* Form title */
#PAGEID_18012 .formTitleContainer .inner {
  padding:0 !important;
}

#PAGEID_18012 h3.formTitle {
  margin:0 0 8px !important;
  padding:22px 22px 10px !important;
  color:#111827 !important;
  font-size:24px !important;
  line-height:1.2;
  font-weight:800;
}

#PAGEID_18012 h3.formTitle:after {
  content:"Please confirm the fields below before continuing.";
  display:block;
  margin-top:8px;
  color:#64748b;
  font-size:14px;
  line-height:1.5;
  font-weight:400;
}

/* Form content */
#PAGEID_18012 .generalFormContainer,
#PAGEID_18012 .formContainer,
#PAGEID_18012 .generalFieldsContainer {
  background:#ffffff !important;
}

#PAGEID_18012 .generalFieldsContainer .inner {
  padding:6px 22px 18px !important;
}

/* Field layout */
#PAGEID_18012 .fieldContainer {
  margin:0 !important;
  padding:12px 0 !important;
  border-bottom:1px solid #eef2f7;
}

#PAGEID_18012 .fieldContainer:last-child {
  border-bottom:0;
}

#PAGEID_18012 .fieldSubContainer table {
  width:100% !important;
}

#PAGEID_18012 .fieldSubContainer td.left {
  width:34% !important;
  padding:8px 18px 8px 0 !important;
  vertical-align:top;
}

#PAGEID_18012 .fieldSubContainer td.right {
  width:66% !important;
  padding:8px 0 !important;
}

#PAGEID_18012 .fieldLabel {
  color:#334155 !important;
  font-size:14px !important;
  line-height:1.4;
  font-weight:700;
}

#PAGEID_18012 .fieldLabel span,
#PAGEID_18012 .fieldLabel strong {
  color:#334155 !important;
  font-weight:700 !important;
}

#PAGEID_18012 .mandatorySymbol,
#PAGEID_18012 .required {
  color:#b45309 !important;
}

/* Inputs */
#PAGEID_18012 input.typeText,
#PAGEID_18012 textarea,
#PAGEID_18012 select {
  width:100% !important;
  max-width:100% !important;
  min-height:42px;
  padding:10px 12px !important;
  border:1px solid #cbd5e1 !important;
  border-radius:10px !important;
  background:#ffffff !important;
  color:#0f172a !important;
  font-size:15px !important;
  box-shadow:none !important;
  box-sizing:border-box;
}

#PAGEID_18012 input.typeText:focus,
#PAGEID_18012 textarea:focus,
#PAGEID_18012 select:focus {
  outline:3px solid #bfdbfe !important;
  border-color:#0b62a3 !important;
}

/* Help text */
#PAGEID_18012 .typeInstruction {
  margin-top:6px !important;
  color:#64748b !important;
  font-size:12px !important;
  line-height:1.45;
  font-style:normal !important;
}

/* Highlight mailing address fields */
#PAGEID_18012 #idContainer11139282,
#PAGEID_18012 #idContainer11139283,
#PAGEID_18012 #idContainer11139284,
#PAGEID_18012 #idContainer11139285,
#PAGEID_18012 #idContainer11139286,
#PAGEID_18012 #idContainer11139287 {
  background:#fff7ed !important;
  border-bottom:1px solid #fed7aa !important;
  margin-left:-22px !important;
  margin-right:-22px !important;
  padding-left:22px !important;
  padding-right:22px !important;
}

#PAGEID_18012 #idContainer11139282 {
  border-top:1px solid #fdba74 !important;
  border-radius:12px 12px 0 0;
  margin-top:10px !important;
}

#PAGEID_18012 #idContainer11139287 {
  border-radius:0 0 12px 12px;
  margin-bottom:10px !important;
}

#PAGEID_18012 #idContainer11139282:before {
  content:"Important: Please confirm your mailing address so you receive NAFIC mailings and member materials.";
  display:block;
  margin:0 0 10px;
  padding:10px 12px;
  background:#fffbeb;
  border:1px solid #fcd34d;
  border-radius:10px;
  color:#92400e;
  font-size:13px;
  line-height:1.45;
  font-weight:700;
}

/* Navigation / buttons */
#PAGEID_18012 .navigationTopContainer {
  display:none;
}

#PAGEID_18012 .navigationOuterContainer {
  background:#f8fafc !important;
  border-top:1px solid #e5e7eb !important;
  margin:0 !important;
  padding:18px 22px !important;
}

#PAGEID_18012 .navigationContainer .inner {
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
}

#PAGEID_18012 input.nextButtonAutoWidth,
#PAGEID_18012 input.nextButton {
  border:0 !important;
  border-radius:10px !important;
  padding:12px 20px !important;
  font-size:14px !important;
  font-weight:800 !important;
  cursor:pointer;
  box-shadow:none !important;
}

#PAGEID_18012 input.nextButtonAutoWidth {
  background:#0b62a3 !important;
  color:#ffffff !important;
}

#PAGEID_18012 input.nextButtonAutoWidth:hover {
  background:#084c7d !important;
}

#PAGEID_18012 input.nextButton {
  background:#ffffff !important;
  color:#0b62a3 !important;
  border:2px solid #0b62a3 !important;
}

/* Validation */
#PAGEID_18012 .validationError {
  display:block;
  margin-top:6px;
  color:#b91c1c !important;
  font-size:12px;
  font-weight:700;
}

/* Mobile */
@media (max-width:700px) {
  #PAGEID_18012 .zoneHeader2 {
    padding:20px 10px 30px;
  }

  #PAGEID_18012 h2 {
    font-size:28px;
  }

  #PAGEID_18012 .fieldSubContainer td.left,
  #PAGEID_18012 .fieldSubContainer td.right {
    display:block !important;
    width:100% !important;
    padding:4px 0 !important;
  }

  #PAGEID_18012 .navigationContainer .inner {
    display:block;
  }

  #PAGEID_18012 .navigationContainer .left,
  #PAGEID_18012 .navigationContainer .right {
    float:none !important;
    width:100%;
    text-align:center;
    margin:8px 0;
  }

  #PAGEID_18012 input.nextButtonAutoWidth,
  #PAGEID_18012 input.nextButton {
    width:100% !important;
  }
}
/* NAFIC Member Directory Profile Page */
#PAGEID_18002 {
  background:#f4f8fb;
  color:#0f172a;
}

/* Main content area */
#PAGEID_18002 .zoneContent {
  background:linear-gradient(180deg,#f8fbff 0%,#eef6fb 100%) !important;
  padding:32px 16px 44px;
}

#PAGEID_18002 .zoneContent .WaLayoutContainerOnly {
  max-width:900px;
  margin:0 auto !important;
}

/* Main profile card */
#PAGEID_18002 .WaGadgetMemberPublicProfile,
#PAGEID_18002 .nafic-card {
  background:#ffffff !important;
  border:1px solid #dbe5ef !important;
  border-radius:18px !important;
  box-shadow:0 12px 30px rgba(11,98,163,.08) !important;
  overflow:hidden;
}

/* Remove old Wild Apricot nested frame look */
#PAGEID_18002 .cornersContainer,
#PAGEID_18002 .c1,
#PAGEID_18002 .c2,
#PAGEID_18002 .c3,
#PAGEID_18002 .c4,
#PAGEID_18002 .c5,
#PAGEID_18002 .r1,
#PAGEID_18002 .r2,
#PAGEID_18002 .r3,
#PAGEID_18002 .r4,
#PAGEID_18002 .r5,
#PAGEID_18002 .d1,
#PAGEID_18002 .d2,
#PAGEID_18002 .d3,
#PAGEID_18002 .d4,
#PAGEID_18002 .d5,
#PAGEID_18002 .d6,
#PAGEID_18002 .d7,
#PAGEID_18002 .d8,
#PAGEID_18002 .d9 {
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

/* Back link */
#PAGEID_18002 .pageBackContainer {
  padding:20px 24px 0 !important;
}

#PAGEID_18002 .pageBackContainer a {
  display:inline-block;
  color:#0b62a3 !important;
  text-decoration:none !important;
  font-size:14px;
  font-weight:700;
}

#PAGEID_18002 .pageBackContainer a:before {
  content:"← ";
}

/* Profile header */
#PAGEID_18002 .memberDirectoryDetailsContainer .inner {
  padding:0 !important;
}

#PAGEID_18002 .profileHeaderContainer {
  background:linear-gradient(135deg,#0b62a3 0%,#084c7d 100%) !important;
  padding:30px 28px !important;
  border-radius:0 !important;
}

#PAGEID_18002 .memberDirectoryDetailsHeaderContainer h2 {
  margin:0 0 8px !important;
  color:#ffffff !important;
  font-size:30px !important;
  line-height:1.18 !important;
  font-weight:800 !important;
  letter-spacing:-.02em;
}

#PAGEID_18002 .memberDirectoryDetailsHeaderContainer h3 {
  margin:0 !important;
  color:#dbeafe !important;
  font-size:16px !important;
  line-height:1.45 !important;
  font-weight:700 !important;
}

/* Section title */
#PAGEID_18002 #membershipDetailsContainer {
  margin:0 !important;
}

#PAGEID_18002 #membershipDetailsContainer .captionContainer .inner {
  padding:24px 28px 10px !important;
}

#PAGEID_18002 #membershipDetailsContainer h4 {
  margin:0 !important;
  color:#111827 !important;
  font-size:22px !important;
  font-weight:800 !important;
}

#PAGEID_18002 #membershipDetailsContainer h4:after {
  content:"Public directory information for this NAFIC member.";
  display:block;
  margin-top:8px;
  color:#64748b;
  font-size:14px;
  line-height:1.5;
  font-weight:400;
}

/* Profile details */
#PAGEID_18002 .generalFieldsContainer .inner {
  padding:8px 28px 28px !important;
}

#PAGEID_18002 .fieldContainer {
  margin:0 !important;
  padding:13px 0 !important;
  border-bottom:1px solid #eef2f7;
}

#PAGEID_18002 .fieldContainer:last-child {
  border-bottom:0;
}

#PAGEID_18002 .fieldSubContainer {
  display:grid !important;
  grid-template-columns:210px 1fr;
  gap:18px;
  align-items:start;
}

#PAGEID_18002 .fieldLabel {
  color:#475569 !important;
  font-size:13px !important;
  line-height:1.45;
  font-weight:800 !important;
  text-transform:uppercase;
  letter-spacing:.06em;
}

#PAGEID_18002 .fieldBody {
  color:#0f172a !important;
  font-size:16px !important;
  line-height:1.55;
  font-weight:600;
}

#PAGEID_18002 .fieldBody span {
  color:#0f172a !important;
}

/* Make key fields feel like directory details */
#PAGEID_18002 #idContainer11139280 .fieldBody span,
#PAGEID_18002 #idContainer11074978 .fieldBody span,
#PAGEID_18002 #idContainer15234474 .fieldBody span {
  display:inline-block;
  background:#f0f9ff;
  border:1px solid #bae6fd;
  color:#0b62a3 !important;
  border-radius:999px;
  padding:5px 10px;
  font-size:14px;
  font-weight:800;
}

/* Profile picture */
#PAGEID_18002 .pictureViewContainer .fieldBody img {
  max-width:160px !important;
  width:160px !important;
  height:160px !important;
  object-fit:cover;
  border-radius:16px;
  border:1px solid #dbe5ef;
  box-shadow:0 8px 20px rgba(15,23,42,.08);
}

/* Mobile */
@media (max-width:700px) {
  #PAGEID_18002 .zoneContent {
    padding:20px 10px 32px;
  }

  #PAGEID_18002 .profileHeaderContainer {
    padding:24px 20px !important;
  }

  #PAGEID_18002 .memberDirectoryDetailsHeaderContainer h2 {
    font-size:25px !important;
  }

  #PAGEID_18002 #membershipDetailsContainer .captionContainer .inner,
  #PAGEID_18002 .generalFieldsContainer .inner {
    padding-left:20px !important;
    padding-right:20px !important;
  }

  #PAGEID_18002 .fieldSubContainer {
    display:block !important;
  }

  #PAGEID_18002 .fieldLabel {
    margin-bottom:4px;
  }

  #PAGEID_18002 .pictureViewContainer .fieldBody img {
    width:130px !important;
    height:130px !important;
  }
}